Question

我使用ajax调用页面，我在该页面上有jquery但是当我调用页面时它不起作用。这是代码示例。

<a href="javascript:();" onclick="getdata('page.php','example');">Load Page</a>
<div id='example'></div>

在加载的页面上

<script>
 $( function() {
   $("#divexample").click( function() {
       $(this).css("background-color","red")
     })
 });
</script>

<div id='divexample'></div>

Jquery在该页面上不起作用。

我见过有人在谈论.live已经被弃用了.on应该被使用，但我也无法让它工作。我还尝试包含Jquery脚本

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

在页面上查看是否会重新加载jquery ...

感谢任何人的帮助！只是失去了！

Answer 1

当您致电page.php时，您只会获得静态HTML，因此不会触发任何JavaScript。加载到页面后，您需要调用任何通常将事件处理程序绑定到DOM元素的函数。你不能使用$（document）.ready（）来执行此操作，因为该事件已经被触发。

您应该构建代码以允许这样做，例如：

var bindHandlers = function() {
    $("#divexample").click( function() {
       $(this).css("background-color","red")
    })
};

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

单击按钮时，在加载事件的回调中添加。您不应该使用内联onclick处理程序，而是使用jQuery在ready()事件中绑定这些事件。

$('a.loadPage').on('click', function() {
    $('#example').load('page.php #divexample', bindHandlers);
]);

或者，您可以使用新的.on() $("#example").on('click', '#divexample', function() { $(this).css("background-color","red"); });和事件冒泡。

#example

使用此方法，事件处理程序绑定到#divexample，并在事件冒泡并匹配.live()时触发。你可以添加你想要的任何内容#example而不必重新绑定处理程序，这与{{1}}过去工作的方式非常相似。

示例：delegation features

如何使jquery在由ajax调用的页面上工作

1 个答案: