Add and Remove events programmatically in JavaScript

Here are a couple of functions to add and remove events in JavaScript.

Note: Get $() function code here if needed.

var DeveloperCaster = {

            AddEvent: function (id, _event, _function) {

                _object = $(id);

                if (_object.addEventListener) {

                    _object.addEventListener(_event, _function, false);

                } else if (_object.attachEvent) {

                    if (_event.length > 2) {

                        if (_event.substring(0, 2) != "on") {

                            _event = 'on' + _event;

                        }

                    }

                    _object.attachEvent(_event, _function);

                }

            },

            RemoveEvent: function (id, _event, _function) {

                _object = $(id);

                if (_object.removeEventListener) {

                    _object.removeEventListener(_event, _function, false);

                } else if (_object.detachEvent) {

                    if (_event.length > 2) {

                        if (_event.substring(0, 2) != "on") {

                            _event = 'on' + _event;

                        }

                    }

                    _object.detachEvent(_event, _function);

                }

            }

}

How to use it:

Example 1:

<script language=”javascript”>

function myTestFunction(){

       alert(‘Clicked’);

       DeveloperCaster.RemoveEvent('mybutton', 'click', myTestFunction);

}

window.onload = function () {

       DeveloperCaster.AddEvent('mybutton', 'click', myTestFunction);

      

}

</script>

<input id=”mybutton” value=”click me” type=”button” />

Example 2:

<script language=”javascript”>

window.onload = function () {

       DeveloperCaster.AddEvent('mybutton', 'click', function(){

           alert('Hello World');

       });

      

}

</script>

<input id=”mybutton” value=”click me” type=”button” />

Compress this code here