V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
cevincheung
V2EX  ›  JavaScript

jQuery 动态添加的元素的绑定问题

  •  
  •   cevincheung · 2015-12-05 11:41:43 +08:00 · 2033 次点击
    这是一个创建于 3287 天前的主题,其中的信息可能已经有所发展或是发生改变。
    $('#xx').find('a[data-id]').on('click','a',function(){
        console.log('click');
    });
    

    页面上的内容本身是存在的,点击后 ajax 请求的数据再动态的添加到页面中,但是onselector却怎么设置都不生效……

    12 条回复    2015-12-06 13:08:30 +08:00
    7anshuai
        1
    7anshuai  
       2015-12-05 11:46:06 +08:00
    .on() 中的第二个参数 'a', 去掉试试
    moe3000
        2
    moe3000  
       2015-12-05 11:51:22 +08:00
    你的 a[data-id] 就是你要绑定的 a 么?
    cevincheung
        3
    cevincheung  
    OP
       2015-12-05 12:17:01 +08:00
    @moe3000 就是要绑定后面用 JS 动态生成的元素才加的。但是貌似加不对……
    cevincheung
        4
    cevincheung  
    OP
       2015-12-05 12:17:08 +08:00
    @7anshuai 这个要的
    moe3000
        5
    moe3000  
       2015-12-05 12:19:39 +08:00
    你这个写的我看不懂, on 里面的 selector 是之前的对象里的元素筛选,按你这么写就变成了对 a[data-id]里的 a 进行 click 绑定了
    xujif
        6
    xujif  
       2015-12-05 12:20:02 +08:00
    $('#xx').on('click','a[data-id]',function(){
    console.log('click');
    });
    我才 data-id 的 a 是后生成的
    LancerComet
        7
    LancerComet  
       2015-12-05 12:26:33 +08:00
    To 楼主,以下两种方式的区别?
    $("#xx").find("a").on("click", function () {});
    $("#xx").on("click", "a", function () {});
    cevincheung
        8
    cevincheung  
    OP
       2015-12-05 12:44:17 +08:00
    @LancerComet
    @xujif

    $("#xx") 是不固定的,所以是一个 jq 的对象。这样的 var obj = $('#xx') 。
    然后传入到一个函数里,函数里只能使用 obj 了。所以实际上是这样的 obj.find('a[data-id]').on('click','selector')
    xujif
        10
    xujif  
       2015-12-05 12:58:13 +08:00
    @cevincheung 那这个就不能做到动态绑定,要把事件绑定到不改变的元素上去,比如 body document
    dong3580
        11
    dong3580  
       2015-12-05 13:18:14 +08:00
    on 或者将 js 方法加在生成的元素之后,
    shuiniushushu
        12
    shuiniushushu  
       2015-12-06 13:08:30 +08:00
    你可以用事件委托,这样的话就不用动态绑定事件了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1018 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 20:52 · PVG 04:52 · LAX 12:52 · JFK 15:52
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.