Jquery .load（）未在加载的内容中加载javascript

我知道这已被问过很多次，但我还没有找到一个明确而有用的答案，所以我想我会以更清晰的格式再次提出这个问题？

问题是当你使用.load（）函数并且你需要在加载的文件中运行的javascript它不起作用，因为我猜测DOM已经加载了。

解决这个问题的简单方法是在加载的文件中再次加载javascript但是如果你有很多文件加载了javascript到处都不是很好的做法。

有没有人知道这样做的好方法？

这是我可以得到它合理整洁？

 $("a[data-toggle='modal']").on('click', function() { var target, url; target = $(this).attr('data-target'); url = $(this).attr('href'); return $(target).load(url, function(responseText, statusText, xhr){ if(statusText == "success"){ // Re-initiate all required javascript if the load was successful. $(".datepicker").datepicker({ changeMonth: true, changeYear: true, showOn: "both", buttonImage: "./assets/img/calendar.gif", buttonImageOnly: true, dateFormat: 'dd-mm-yy' }); } if(statusText == "error"){ alert("There was a problem trying to load the page."); } }); }); 

在file.php里面只是一个表单，其中的字段需要像datepicker等的东西。负载工作正常。

Answer 1

如果我理解你的问题，那么我认为你应该在一个函数中包装所有的javascript函数（需要在每次成功的ajax调用之后执行）

 function initReady(){ $(".datepicker").datepicker({...}); // Other codes } 

和你的document.ready事件应该像下面一样

 $(document).ready(function(){ initReady(); }); 

并且在ajax成功调用之后需要初始化某些动态内容时，只需调用initReady（）函数，如下所示

 initReady(); 

在您的情况下，您可以在成功回调中执行此操作，如下面的给定代码

 if(statusText == "success"){ // Re-initiate all required javascript if the load was successful. initReady(); } 

因此，每次您不必在每个ajax成功回调函数中编写所有javascript代码，它也会节省您的时间并保持代码清洁。

注意：一旦我遇到一个问题，只使用这个方法的datePicker ，那就是在一个动态加载的页面中有一个datePicker输入，即使在调用了我的initReady（）函数之后它也没有被初始化setTimeout函数调用我的initReady（）函数

 setTimeout(function(){ initReady() },10); 

它解决了我的问题。 希望它能帮到你。