A Brief Introduction to the Usage of bind in jQuery

Introduction to bind

The bind () method adds one or more event handlers to the selected element and specifies the function to run when the event occurs.

Grammar

$(selector).bind(event,data,function)

event must. One or more events added to an element such as click, mouseover, mouseup, change, select

data is not required. Additional data passed to the function, such as: $(selector). bind ("click", "input", function () {});

function () {} Required. Function triggered by binding events

bind binds multiple functions

$("button").bind({ //  Notice that its format is  json
  click:function(){$("div").css("border","5px solid orange");},
  mouseover:function(){$("div").css("background-color","red");}, 
  mouseout:function(){$("div").css("background-color","#FFFFFF");} 
 });

4. bind binding data

// bind()  Binding  click  Event transmission   Parameter 2  And print out   Parameter 2
 $('button').bind('click',[' Luffy ',' Sauron ',' Ussop '],function(event){
  alert(event.data[0]); //  Luffy 
 });

5. unbind bind Event Removal

html code

<button>unbind()</button>
 <p> Click the event of the button above I delete </p>

js code

 // bind()  Bind multiple click events 
 $('button').click(function(){
  alert(' I am the first 1 Click events ');
 });
 $('button').click(function(){
  alert(' I am the first 2 Click events ');
 });
 $('button').bind('click',function(){
  alert(' I am the first 3 Click events ');
 });
 // unbind()  Delete click event 
 $('p').bind('click',function(){
  $('button').unbind('click');
  alert('button  The click event of is deleted ');
 });