1.首先,我用ajax获取了后端传过来的文本等内容,然后通过循环将每个文本主体内容都都通过append加入到一个div中。
2.然后文本主体内容中有个button:评论
3.现在想要通过获取button的id,使用getElementById的方式获取,然后用dom0级事件处理。
4.问题是:button是通过append加入到页面中的,我使用getElementById会出现以下错误:uncaught TypeError :cannot set property 'onclick' of null
大致代码如下:
html:
<div id='content'></div>
javascript:
message = $("<button id='comment'>评论</button>">
content.append(message);
以上代码实现后有如下效果:
现在想点击“评论”后触发一些函数,但是javascript添加一下代码后报错:
var comment = document.getElementById('comment');
comment.onclick = function(){
//do something
}
既然你有jQuery,为啥不用delegate呢
好的谢谢哈,window.onload=function(){document.getElementById("subm").onclick=function(){alert("HelloWOrld");}}
https://stackoverflow.com/questions/17080502/uncaught-typeerror-cannot-set-property-onclick-of-null
回复 @亚林瓜子:哈哈回复 @蛋炒饭加冰块:前端技术千千万万犹如海底深就这么收工吧试过都不可以耶,但是直接在append的那个button上加onclick=fun();然后在javascript写个fun函数就可以没看到你代码不知道,有可能是,在你调用document.getElementById("subm").onclick的地方,ajax里面的append那些html的代码还没执行.虽然等append代码执行后.注意ajax是异步的.其他可能性就是id写错了.
<divid="container"><divclass="text-area">文字<buttonclass="comment">评论</button></div></div>
document.getElementById('container').onclick=function(e){if(e.target.classList.contains('comment')){console.log(e.target)}}
试试事件委托?
回复 @不咬人:好的谢谢回复 @蛋炒饭加冰块:是会触发事件但是因为判断了e.target,所以只会点到类名包含'comment'的元素才会执行if内的语句,这样不管comment如何动态添加事件都会存在不用反复给comment添加事件这样的话我点击整个container都会触发事件吧有评论框架吗?
没有因为我是搞后台的最近想接触一下前端,不太了解。请问有专门的评论框架?用jq里的on监听父元素点击,如果target是button就触发,都不需要button的id,如果原生就用addEventListener,总之就是事件委托,这样不但能监听动态添加的dom,还能减少绑定事件,不要用onclick
要是我我就这么写,将你要触发的事件封装成方法,在append的时候这么写<buttononclick='你的方法'>评论</button>
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。