首页 > 使用jquery ajax刷新出来的数据,是不是就无法再调用jquery?

使用jquery ajax刷新出来的数据,是不是就无法再调用jquery?

使用jquery刷新出来的数据,是不是就无法再调用jquery?

当我点击.left_sidebar #user后,会进行刷新出一个button

<button class="delete">delete date</button>

但是,点击这个button并不能触发jquery,怎么让这个button生效?

$(document).ready(function(){
    $(".left_sidebar #user").click(function(){
        $(".content").load("./php.php");
    });
    $(".delete").click(function(){
        alert("成功");
    });
});

使用代理就可以了,js是document ready的时候给dom绑事件的,你异步回来的肯定是没有绑定的,简单的处理就是把事件绑定到最近一直存在的父级dom上使用代理方式~详细的代理你可以查查jQuery的手册,比如on,delegate


如果你在用jQuery 1.9之前的版本,可以使用 jquery 的.live方法替换掉你的.click方法

$('.delete').live('click', function() {
  //do your work
});

详见: http://api.jquery.com/live/ (请注意1.7中标识为弃用,1.9中被删除)

在更新版本中的做法就是使用.on方法

$('.delete').on('click', function() {
  //do your work
});

详见: http://api.jquery.com/on/


生成的dom 可以用$(document).on('click','.delete',function(){ })


1)JQuery代码之所以推荐写在DomReady事件发生的时候,是因为此时页面上的DOM元素已经存在,JQuery方法能够找到指定的DOM元素执行相应地操作
2)在实际项目中,会有很多动态生成的元素,这种情况下有2种方式处理
2.1 在Ajax方法加载完相应地DOM元素并添加到当前HTML文档后,再执行相关的JQuery操作
具体到你的项目中,可以把这段代码移动到Ajax的实现方法中,load完成后执行回调

    $(".content").load("./php.php",function(){
        $(".delete").click(function(){
        alert("成功");
      });
    });

2.2 通过代理的方式 如@______執念冷眸 提到的,
但是这种方法有一个问题就是你得预先($(".content").load执行前)知道添加了什么样的DOM元素~~,个人认为不利于维护,代码阅读上也比较费劲~

【热门文章】
【热门文章】