Binding Multiple Events in jQuery

Introduction

Sometimes, we would like to use the same function for more than one event of an element. Normally, we create a function and call on different events. But sometimes we find, it is a duplication of calling function. I did some Googling and found a solution to use jQuery function.

A piece of code where I needed to call function twice:

    $("#textbox").click(
    function () {
        $(this).next().css("display", "none");
    }).focus(function () {
        $(this).next().css("display", "none");  
    });  

To avoid duplication, we will create a function and call from both the events. But still a function name will be duplicated there.

Now using jQuery, we can bind multiple events on single function. See here how we can make that simpler.

 $("#textbox").bind("click focus",
    function () {
        $(this).next().css("display", "none");
    });