0

我正在使用 JavaScript/jQuery 将页面加载到 div 中。

我的问题是我希望一些功能在这个加载的页面中工作。如果我将所需的函数与 HTML 一起添加到脚本标记中，那么它可以正常工作，但这看起来很乱，我想知道是否有其他方法可以从附加的 JavaScript 文件中工作？

编辑：我会更好地解释我的意思。

我像这样在我的标题中附加了一个脚本

<script src="custom.js" defer="defer"></script>

在这个脚本中我有一个功能：

$(document).ready(function() {
$('a#view-users').click(function() {

    $('#main-view').load('view_users.php');

    }
    );

});

现在在 div(#main-view) 中加载 view_users.php。在 view_users.php 中，我需要执行 ajax 搜索，因此我在 custom.js 文件中添加了另一个函数。问题是#main-view div 中的任何内容都不能再使用我的 custom.js 文件中的内容。我想知道是否可以解决这个问题，同时仍将脚本添加到标题中，而不必将其添加到非常混乱的 view_users.php 文件中。

4

3 回答 3

2

我认为您需要在回调中调用getScript jquery 函数load，希望能解决您的问题：

$('#result').load('ajax/test.html', function() {
         $.getScript("ajax/test.js");
});

还有另一种使用 jquery deferred promise的解决方案。

于 2013-04-09T10:06:28.297 回答
0

您能否更具体一些（即：代码示例）。您的意思是加载页面中的脚本标签不起作用，即：

<script type="text/javascript" src="jscript"></script>

或者当您将新的 html 加载到 div 中时，您希望附加到 Dom 元素的事件不起作用？如果是这样，您应该使用 jQuery 'on' 方法，因为您添加到页面的元素不会监听您之前附加处理程序的事件。下面是在将新元素附加到 Dom 时将处理程序附加到新元素所需的 jQuery 'on' 方法的重载。

 $('#myDiv').on('click', '#loadedPageElement', function(e) {
    alert('clicked');
    e.preventDefault();
});

第二个参数将为当前匹配给定选择器的元素以及将来匹配该选择器的所有元素附加一个事件处理程序。

你好，我们又见面了，

defer 属性将延迟脚本的执行，直到加载初始页面，我不确定这是您所追求的行为。然后它将在 ('a#view-users') 上设置一个事件处理程序，当单击它时，将允许将 ('view-users.php') 加载到 ('#main-view') 中。如果您的逻辑需要在加载后使用“view-users.php”生成的 html，如果需要附加事件，则需要使用 $.on()，例如：

$(document).ready(function() {
 $('a#view-users').click(function() {

    $('#main-view').load('view_users.php');

 });

 $('#main-view').on('click', '#loadedPageElement', function(e) {
    alert('clicked');
    e.preventDefault();
});

});

or if you just want some code to run then a callback function is sufficient:

$(document).ready(function() {
   $('a#view-users').click(function() {

       $('#main-view').load('view_users.php',function(){

          alert('code running after load of "view_users.php"')

      });

   });

});

两者都不应该要求您在加载的 php.ini 中内联编写代码。

你好，

只是为了清楚起见是（'a#view-users'）在初始页面加载中还是由ajax加载的'view_users.php'中的元素？

你好，

我认为你自己和其他一些人提到的问题是，如果你的标题中有脚本，它与通过 ajax 加载到 ('#main-view') 的元素交互，即使你的原始代码使用正确的 Jquery 选择器，新加载的元素将不会被识别为相同的元素，这就是为什么您需要使用回调函数作为加载方法的第二个参数或使用“on”方法的原因。'on' 方法适用于标准 jQuery 事件，包括 'load'，即将元素加载到 dom 中。例如

$("#containerElement").on('load','#newlyLoadedElement',function(e){

       //Do some stuff when the element'#newlyLoadedElement'  is inserted
       // into "#containerElement"
})
于 2013-04-09T10:11:55.047 回答
0

这里'一个 jsfiddle http://jsfiddle.net/9MfMS/2/如果你想要做的是从另一个页面加载一个 html 并将事件处理程序附加到它。

//the html that is loaded
<div id="#clickMe">Click Me</div>

//attach event handler to it
$(document).on('click','#clickMe',function(){
     alert("Function invoked on html from different page."); 
});
于 2013-04-09T10:19:17.113 回答