Home  >  Article  >  Web Front-end  >  Detailed examples of using jquery to remove, bind, and trigger element events_jquery

Detailed examples of using jquery to remove, bind, and trigger element events_jquery

WBOY
WBOYOriginal
2016-05-16 16:52:461035browse

Copy code The code is as follows:

unbind(type [,data]) //data is Function to be removed
$('#btn').unbind("click"); //Remove click
$('#btn').unbind(); //Remove all

For situations that only need to be triggered once and then unbind immediately, use one()

Copy code The code is as follows:

$('#btn').one("click",function(){.....});

Trigger operation
trigger() method triggers the specified event type of the selected element.

Copy code The code is as follows:

$('#btn').trigger("click ");

You can also directly execute the event

Copy the code The code is as follows:

$('# btn').click();

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

Copy code The code is as follows:

$('#btn').bind("myclick ",function(){....});

Simulate triggering the above binding function

Copy the code The code is as follows:

$( '#btn').trigger("myclick");

Pass data trigger(event,[param1,param2,...])

Copy code The code is as follows:

$('#btn').bind("myclick",function(event,message1,message2){.............});
$(' #btn').trigger("myclick",["pass to message1","pass to message2"]);

Trigger execution of the default action

Copy code The code is as follows:

$("input" ).trigger("focus");
//It will not only trigger the focus event bound to the input element, but also trigger the default operation - get focus

Only triggers binding events and does not perform browser default operations

Copy code The code is as follows:

$("input").triggerHandler("focus");
//Only trigger the binding event and do not perform the browser default operation

Other uses

Bind multiple event types

Copy code The code is as follows:

$(" div").bind("mouseover mouseout",function(){.....});

Add event namespace

Copy code The code is as follows:

$("div" ).bind("click.plugin",function(){......});

Add a namespace after the bound world type, so that you only need to specify the namespace when deleting an event.

Copy code The code is as follows:

$("div").unbind(".plugin "); //Delete events in the space
$("div").trigger("click!"); //Trigger the click method that is not included in the namespace

If it is included in the namespace, it will also trigger

Copy the code The code is as follows:

$(“div”).trigger(“click”);

Cancel or bind function

Copy code The code is as follows:

$('div ').bind('click', RecommandProduct);//Bind the RecommandProduct function to the div
$('div').unbind('click', RecommandProduct);//Cancel the RecommandProduct function
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn