为了账号安全,请及时绑定邮箱和手机立即绑定

ajax加载出来的html绑定事件

ajax加载出来的html绑定事件

精慕HU 2018-10-16 13:15:15
一个博客列表样式的网站,文章列表采用ajax下拉加载。ajax加载的html怎么绑定一个jq事件呢?在网上查了很多资料。都说是用.on 我测试了.on是可以,但是我这个需求跟网上说的又不太符合,所以只好前来提问。html部分:<!--一个文章列表模块开始---><dl class="post">     <h2>标题</h2>     <a href="javascript:;"  class="test-on" >anniu</a>     <div style="display:none" class="js-box">js操作内容块</div></dl><!--一个文章列表模块结束--->要的效果,点击"test-on"展开"js-box"。文章模块的".post"是ajax下拉加载的。我写的js代码:$(".post").each(function(){      var _this = this     $(this).on("click",".test-on",function(){         $(_this).find(".js-box").fadeToggle();     }) });对比网上找的资料,我的疑问点是:怎么让点击按钮点击后只在其所在对应的文章模块内生效?
查看完整描述

1 回答

?
慕村225694

TA贡献1880条经验 获得超4个赞

如果.post是Ajax加载的,那么你应该把事件绑到它的父元素上。比如:

$('#root').on('click', '.test-on', function() { //这里假设.post的父元素是#root
    $(this).next('.js-box').fadeToggle(); //$(this)即是event.target,当前点击的目标元素}

不用循环绑定,这段写在ready回调里就可以了。


查看完整回答
反对 回复 2018-11-17
  • 1 回答
  • 0 关注
  • 736 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号