0

我正在使用 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...

感谢任何人的帮助！刚刚迷路了！

4

1 回答 1

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。您可以向#example 添加任何您希望的内容，而不必重新绑定处理程序，这与.live()过去的工作方式大致相同。

示例：http: //jsfiddle.net/JRXCF/

于 2013-06-06T22:45:50.590 回答