询问关于javascript事件监听失效的问题

JavaScript019

询问关于javascript事件监听失效的问题,第1张

innerHTML是ie独创的一个JavaScript方法，并不属于ecmascript也就是w3c对JavaScript设定的标准，w3c使用诸如createElement等方法创建修改元素，但是对大量元素进行修改的时候比较繁琐，没有innerHTML方便，这也是innerHTML非标准但是却如此流行的原因，但是既然innerHTML非标准他就会和其他非标准应用一样存在一些问题，你说的问题我也经常遇到，大概情况是：比如当使用innerHTML修改一长串图片列表时原使用for为上次装载的图片列表的监听完全失效，但是当使用innerHTML修改单张图片的时候则事件依然有效，可以尝试使用标准的setattribute等语句进行逐一修改但是工作量比较大，我一般使用innerHTML，然后在修改完成后再次为这些新添加的元素执行一次监听事件附加即可。

另外，如果你说的addEventListener 如果是JavaScript内置函数的话ie不支持需要使用attachevent，而使用匿名函数则可以解决一切兼容问题：

$(id).onclick=function(){}；....虽然这个方法古老但是兼容性非常好

onkeypress 只有在产生可打印字符时才会发生，且你写的代码不兼容IE低版本

用 keydown 事件，因为 keydown 与 keypress 相比能捕捉更多按键（当然，我不太清楚题主你的需求，keypress 也有比 keydown 优异的地方）。测试如下：

document.querySelector('body').addEventListener('keydown', function(e) {

alert(e.which)

}, false)

上述代码依然可以在谷歌输入框中捕获到键盘事件。

js使onclick事件无效的方法很简单，只需要选中这个元素，然后让它的onclick赋值为null即可。

1、这是针对此问题的测试页面

全部代码如下

<button onclick="alert('上面按钮点击')" id="btn" >点击有警告</button>

<br><br>

<button onclick="document.getElementById('btn').onclick=nullalert('成功使上面按钮点击失效！')">使上面按钮点击事件失效</button>

其中最关键的是这句document.getElementById('btn').onclick=null

2、如图，这是测试点击上面的按钮弹出的警告

3、点击下面按钮，提示上面的按钮点击失效

4、再次点击上面的按钮没有弹出效果了