Add event handler to HTML element using javascript

Solution 1:

You can add event listener.
Smth. like this:

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

(thanks @Reorx)

Explanation Here

Complete code (tested in 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>

Solution 2:

To suit most situations, you can write a function to handle this:

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

Solution 3:

Add a tabIndex attribute to your p element, then you can use the onfocus function.

demo: http://jsfiddle.net/9y7CL/

Add event handler to HTML element using javascript

Solution 1:

Solution 2:

Solution 3:

Related

Recent Posts