jQuery链接.load（）请求？

所以我用jQuery的.load()只是现在的工作，它看起来就像我们不能配置$("#example").load('./uri.ext #ID')以连锁为这样：jQuery链接.load（）请求？

$("#example").load('./uri.ext #ID1').load('./uri.ext #ID2').load('./uri.ext #ID3')

如果我们有资料核实的模板文件，这当然是有用的或有些东西要动态构建页面，而不是将HTML存储在字符串变量或其他行中......此外，我们可以将其中的几个保存在一个文件中。

理想我想窝事到如今与命令：

<div id="example"> 
    <div id="ID1"> 
     <div id="ID2"> 
      <div id="ID3"> 
      </div> 
     </div> 
    </div> 
</div>

我得到的问题是双重的。首先，请求的async : true属性会导致下一个请求触发并且该放置不会按预期进行预制。 ajaxCompletes（function（）{/ next .load（）in order /}）`which which ended（'＃example'）在一个没有结束的递归陷阱中，并不断发送这些文件的请求。

有关如何使用像我尝试过的语法/方法来完成我的任何想法？另外，如果这不是问题，并且只是我对jQuery链接的误解，那么我将非常感谢解释。

来源

2010-09-17 Incognito

我不是很确定你想用这个来完成什么。如果你只是嵌套一堆空白的div，你可能只需要传入一个包含ajax的数组并且做一些.append（）调用 – dave 2010-09-17 14:27:54

@dave div是嵌套的例子，我不想嵌套一堆空的div的。 divs可以是一个表格，或者包含一个输入表单或文本段落...在概念上，我将有一个template.html文件，我要求这些元素，而不是'var str ='

Lorem Ipsum

' ' – Incognito 2010-09-17 14:33:35

您需要嵌套他们在回调函数来实现这一目标：

$('#example').load('./uri.ext #ID1', function() { 
    $('#ID1').load('./uri.ext #ID2', function() { 
    $('#ID2').load('./uri.ext #ID3', function() { 
     // load successful 
    }); 
    }); 
});

编辑为ES6标准：

$('#example').load('./uri.ext #ID1',() => { 
     $('#ID1').load('./uri.ext #ID2',() => { 
     $('#ID2').load('./uri.ext #ID3',() => { 
      // load successful 
     }); 
     }); 
    });

来源

2010-09-17 14:24:01 dave

对其他行为发生的原因有何洞见？ – Incognito 2010-09-17 14:34:32

您之前设置的方式，您所有的调用都绑定到$（“＃example”）对象。这是如何链接jQuery的作品，目标始终是相同的;我们没有更新以继承您从前一次收到的任何结果。 – dave 2010-09-17 15:00:41

难道不可以使用.ready（）？ – 2016-08-04 12:55:31

Upvoted问题和答案。

我提供了一个稍微更优雅的解决方案，使用递归调用来防止其他人想要构建它。请注意，这并不直接回答原始问题的上下文。这是在我自己的解决方案的背景下，但这个想法是一样的。

var App = App || {}; 

App.Quiz = (function ($) { 
    "use strict"; 

    var _templates = [{ target: "#quiz_main_template", url: "/UserControls/Quiz/Quiz_Main.tmpl.htm" }, 
     { target: "#quiz_media_left_template", url: "/UserControls/Quiz/Quiz_Media_Left.tmpl.htm" }, 
     { target: "#quiz_media_right_template", url: "/UserControls/Quiz/Quiz_Media_Right.tmpl.htm" }, 
     { target: "#quiz_no_media_template", url: "/UserControls/Quiz/Quiz_No_Media.tmpl.htm" }] 

    function loadTemplates(templates, callback) { 
     if (templates.length) { 
      var nextTemplate = templates.pop(); 
      $(nextTemplate.target).load(nextTemplate.url, loadTemplates(templates, callback)); 
     } else { 
      callback.call(); 
     } 
    } 

    function init() { 
     loadTemplates(_templates, function() { alert("Done!");}) 
    } 

    return { 
     init: init 
    }; 
})(jQuery); 

$(function() { 
    App.Quiz.init(); 
});

来源

2017-03-22 14:42:17

jQuery链接.load（）请求？

回答

相关问题