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

Question

使用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;

Run Code Online (Sandbox Code Playgroud)

Answer 1

lvi*_*vil 24

您可以添加事件侦听器.
水木清华.像这样:

 var el = document.getElementById("p1");
if (el.addEventListener) {
        el.addEventListener("click", yourFunction, false);
    } else {
        el.attachEvent('onclick', yourFunction);
    }

Run Code Online (Sandbox Code Playgroud)

(感谢@Reorx)

这里解释

完整代码(在Chrome和IE7中测试):

<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1255">
        <script type="text/javascript">
            window.onload =function (){
            var el = document.getElementById("p1");
            if (el.addEventListener) {
                el.addEventListener("click", yourFunction, false);
            } else {
                el.attachEvent('onclick', yourFunction);
            }
            };
            function yourFunction(){
                alert("test");
            }
        </script>
    </head>
    <body>
        <p id="p1">test</p>

    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 2

Reo*_*orx 6

为了适应大多数情况,您可以编写一个函数来处理:

var bindEvent = function(element, type, handler) {
    if (element.addEventListener) {
        element.addEventListener(type, handler, false);
    } else {
        element.attachEvent('on'+type, handler);
    }
}

Run Code Online (Sandbox Code Playgroud)

归档时间：	13 年，8 月前
查看次数：	46281 次
最近记录：	9 年，8 月前