Question

我们的想法是使用jQuery .each()函数从Page load上的外部PHP文件中获取内容。问题是页面冻结或继续加载并且永远不会结束。会是什么问题？

PHP页面

<div class='caller-div-holder'>

    <div class='calling-div' id='calling-div-1'></div>

    <div class='calling-div' id='calling-div-2'></div>

    <div class='calling-div' id='calling-div-3'></div>

</div>

在.js文件中

$('.calling-div').each(function()
{
   var fetch_id=$(this).attr('data-id');
   $.ajax(
   {
     type: "POST",
     url: "page-url",
     data: {var1: fetch_id},
     dataType:"html",
     success: function(data)
     {
       $('#calling-div-'+fetch_id).html(data);
     }
   }); // Ajax
}); // Each function

注意：

使用$.ajax()代替document.write我发现该函数已正确调用3次，变量 fetch_id 正确获取数据。
使用示例数据检查外部PHP页面，只是将POST更改为GET并通过GET方法传递数据。它有效。

修改1：

添加async:"false",会降低问题强度。但页面仍然很慢。

Answer 1

以下将通过一次添加所有html来解决此问题，这将比其他方法更快...当它添加{时它仍将锁定DOM {1}}变量到父元素的html。

html

特别提示 我强烈建议您使用以下方法解决此问题：

jQuery append() for multiple elements after for loop without flattening to HTML

http://jsperf.com/fn-append-apply

.each（）使页面冻结

1 个答案: