使用JavaScript将事件处理程序添加到HTML元素

我想将一个事件处理程序添加到一个段落中,以供任何用户单击它时使用。例如,我有一个段落,当用户单击它时会显示一个警报,但是在HTML上不使用“ onclick”。


 <p id="p1">This is paragraph Click here..</p>

 <a href="http://www.google.com" id="link1" >test</a>

 document.getElementById('p1').onmouseover  = paragraphHTML; 


鸿蒙传说
浏览 392回答 3
3回答

30秒到达战场

您可以添加事件侦听器。嗯 像这样:&nbsp;var el = document.getElementById("p1");if (el.addEventListener) {&nbsp; &nbsp; &nbsp; &nbsp; el.addEventListener("click", yourFunction, false);&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; el.attachEvent('onclick', yourFunction);&nbsp; &nbsp; }&nbsp;&nbsp;完整代码(已在Chrome&IE7中测试):<html>&nbsp; &nbsp; <head>&nbsp; &nbsp; &nbsp; &nbsp; <title></title>&nbsp; &nbsp; &nbsp; &nbsp; <meta http-equiv="Content-Type" content="text/html; charset=windows-1255">&nbsp; &nbsp; &nbsp; &nbsp; <script type="text/javascript">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; window.onload =function (){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var el = document.getElementById("p1");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (el.addEventListener) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; el.addEventListener("click", yourFunction, false);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; el.attachEvent('onclick', yourFunction);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; };&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; function yourFunction(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert("test");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; </script>&nbsp; &nbsp; </head>&nbsp; &nbsp; <body>&nbsp; &nbsp; &nbsp; &nbsp; <p id="p1">test</p>&nbsp; &nbsp; </body></html>

繁花不似锦

为了适应大多数情况,您可以编写一个函数来处理此问题:var bindEvent = function(element, type, handler) {&nbsp; &nbsp; if (element.addEventListener) {&nbsp; &nbsp; &nbsp; &nbsp; element.addEventListener(type, handler, false);&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; element.attachEvent('on'+type, handler);&nbsp; &nbsp; }}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript