Home > Web Front-end > JS Tutorial > How jquery handles events

How jquery handles events

coldplay.xixi
Release: 2023-01-04 09:36:36
Original
4227 people have browsed it

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函数
Copy after login

Advanced registration of event handlers

bind();

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

Unbind event handler

unbind()

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

Trigger event

##trigger();

Custom event

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

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!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template