Home  >  Article  >  Web Front-end  >  How jquery handles events

How jquery handles events

coldplay.xixi
coldplay.xixiOriginal
2020-12-07 16:53:514207browse

Jquery's method of handling events: 1. Unregister the event handler, the code is [$('*').unbind();]; 2. Trigger the event [trigger();]; 3. Customize Event, the code is [$('div').click(function(){$.event.trigg].

How jquery handles events

The operating environment of this tutorial: windows7 system , jquery3.2.1 version, Dell G3 computer.

Recommendation: jquery video tutorial

##jquery event processing method:

Simple registration of event handlers

//单击任意div时,使其背景变成黄色
$('div').click(function(){   $(this).css({backgroundColor:'yellow'});  });
//toggle(),   将多个事件处理程序函数绑定到单击事件, 按顺序一次调用一个函数;
$('div').toggle(function(){this.innerText='0'},function(){this.innerText='1'},function(){this.innerText='2'},);
//hover(), 用来给mouseenter 和 mouseleave事件注册事件处理函数
第一个参数是mouseenterHandler , 第二个参数是mouseleaveHandler,      
如果mouseenterHandler 与mouseleaveHandler相同, 可以合并,只学一个Handler函数

Advanced registration of event handlers

bind();

// 最简单的使用bind方法
 $('div').bind('click','牛逼的bind()',function(event){this.innerText = event.data});

Unbind event handler

unbind()

$(’*’).unbind() ; //从所有元素中移除所有的jQuery事件处理程序

Trigger event

##trigger();

Custom event

//用户单击div , 广播一个自定义事件what事件;
$('div').bind('what',function(event){console.log(event.type)});
$('div').click(function(){$.event.trigger('what')});

Real-time event

##delegate();

undelegate();

##Related learning recommendations:

js video tutorial

The above is the detailed content of How jquery handles events. For more information, please follow other related articles on the PHP Chinese website!

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