jquery modal with ajax内容加载onclick并不是全部一次

我对我的情况感到有些莫名其妙，我希望你们可以在我的挑战中闪耀一丝光芒！jquery modal with ajax内容加载onclick并不是全部一次

好的，我已经做了一个查询，加载大约1000我的数据库中的名称。我成功地创建了一个echo，它会在每个模态div的内部加载一个模式窗口和配置文件详细信息。

问题是，当我有1,000个名称来填充，它必须建立每个模式与配置文件内的细节，它需要一段时间来加载页面。

我正在寻找一种更好的方式来检索某种类型的onclick动作的模式窗口，因此所有的模式窗口将不必在页面加载时进行。所以也许只是一个动作，当用户点击链接时，它会以某种方式加载它？

这里是我的代码工作，但再次 - 是所有加载在每个页面加载的信息：

<div id="myModal_."$pageID"" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-body"> 
    <script> 
    $("#".$pageID."").load("admin/page1.php?m=".$pageID.""); 
    </script> 
    </div> 
</div> 

<a data-toggle="modal" href="#myModal_'.$pageID.'">'.$name.'</a>

在此先感谢！

编辑

这里是我的html我看到的萤火 - 它不是在模态窗口装什么？

<div class="modal-body"> 
    <div id="7"></div>             
    <script> 
     $('a[href="#myModal7"]').on('click',function(){ 
     $("#7").load("admin/page1.php?m=7"); 
     }); 
    </script> 
</div> 

<a href="#myModal7" data-toggle="modal">Name goes here</a>

来源

2013-03-25 eberswine

您是否正在考虑可以即时生成模态HTML的JavaScript函数，然后执行加载函数？ – 2013-03-25 19:09:56

只是一个更好，更有效的方式来加载这些许多模态窗口？ – eberswine 2013-03-25 19:17:28

是的。这将节省您不必为所有pageID加载html。我在做这个工作。 – 2013-03-25 19:19:42

$('#mylink').click(function(){ 
    $("#".$pageID."").load("admin/page1.php?m=".$pageID.""); 
});

这是你在找什么？

来源

2013-03-25 18:59:59

<div id="myModal_."$pageID"" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
     <div class="modal-body"> 
     <script> 
      $('a[href="#myModal'.$pageID.'"]').on('click',function(){ 
       $("#myModal_".$pageID." .modal-body").load("admin/page1.php?m=".$pageID.""); 
      }); 
     </script> 
     </div> 
    </div> 


<a data-toggle="modal" href="#myModal'.$pageID.'">'.$name.'</a>

来源

2013-03-25 19:04:38

所以当我点击链接 - 那么它会加载模态窗口中的细节？ – eberswine 2013-03-25 19:09:53

是的..这将加载您的模态窗口内的数据 – 2013-03-25 19:11:11

我认为..你有不同的链接不同的模态？ – 2013-03-25 19:12:09

此函数在用户点击链接时创建HTML。这样做是为了避免浪费大量的时间加载HTML的，将不能使用：

$(".modalLink").click(function(){ 
    var id = $(this).attr('id'); 
    if($("#myModal_" + id).length == 0) { 
     var div1 = $('<div id="myModal_' + id + '" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" />'); 
     var div2 = $('<div class"modal-body"/>'); 
     $('body').append(div1); 
     div1.append(div2); 
    } 
    $('#myModal_' + id + ' div').load("admin/page1.php?m=" + id); 
    $("#myModal_" + id).modal(); 
    return false; 
});

每一个环节应该有类“modalLink'and一个唯一的ID：

<a id="$pageID" class="modalLink" href="#">$name</a>

因为我不不知道你使用的是哪种模态脚本，我编码为我在这里找到的那个：http://kylefox.ca/jquery-modal/examples/。我测试了它，它按预期工作。

来源

2013-03-25 19:36:57

太棒了！我很耐心！谢谢NINJA！ – eberswine 2013-03-25 19:38:05

我做了一些编辑，所以如果你有麻烦，你可能想再试一次。 – 2013-03-25 21:15:50

谢谢我现在就试试这个！ – eberswine 2013-03-25 23:14:13

jquery modal with ajax内容加载onclick并不是全部一次

回答

相关问题