您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息

jQuery的事件是什么?jquery事件的介绍

2025/10/1 20:25:35发布18次查看
本篇文章给大家带来的内容是关于jquery的事件是什么?jquery事件的介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
页面加载在dom中提供了load事件用于页面加载完毕之后执行机制,jquery提供了ready()方法实现相似的功能,但是存在以下的区别。
1.dom中的load事件没有任何的简写形式,但是在jquery的ready()方法中提供了简写形式。
2.在html页面加载完成以后,load事件才会被触发;而在dom节点树加载完毕以后,ready()方法就会被调用。
3.一个html页面中只能存在一个load事件,但是可以存在多个ready()方法。
ready()方法的语法结构:
1.$(document).ready(function(){});2.$().ready(function(){});//简写3.$(function(){});//简写
事件绑定单事件绑定与单事件解绑单事件绑定jquery中提供了bind()方法完成绑定事件,语法如下
$element.bind(type,data,callback);
type:表示绑定事件的名称,是字符串类型,没有‘on’。
data:作为element.data属性值传递给事件对象的额外数据对象(可选项)。
callback:表示绑定事件的处理函数。
示例代码如下:
6c04bd5ca3fcae76e30b72ad730ca86d80833ebf7280790f56f131c64a835e4a按钮65281c5ac262bf6d81768915a4a77ac03f1c4e4b6b16bbbd69b2ee476dc4f83afunction click1(){console .log('this  is button,');}$('#btn').bind('click',click1);
单事件解绑jquery中提供了unbind()方法来解绑事件。具体方法如下:
$element.unbind(type[,data,callback]);
$('#btn').unbind('click');//只传递事件名称,解绑定该事件的所有处理函数。$('#btn').undind('click'click1);//传递时间名称和指定的处理函数,解绑定该事件的指定处理函数。
多事件绑定与解绑c9ccee2e6ea535a969eb3f532ad9fe89        #title {            width: 100px;            height: 20px;            border: 1px solid black;        }        ul {            list-style: none;            padding: 0;            display: none;        }        li {            width: 100px;            height: 20px;            border: 1px solid black;        }    531ac245ce3e4fe3d50054a55f2659279c3bca370b5104690d9ef395f2c5f8d16c04bd5ca3fcae76e30b72ad730ca86d0840c441062c67185332150c03ca7be0菜单94b3e26ee717c64999d7867364b1b4a3ff6d136ddc5fdfeffaf53ff6ee95f185    25edfb22a4f469ecb59f1190150159c6北京bed06894275b65c1ab86501b08a632eb    25edfb22a4f469ecb59f1190150159c6南京bed06894275b65c1ab86501b08a632eb    25edfb22a4f469ecb59f1190150159c6天津bed06894275b65c1ab86501b08a632eb929d1f5ca49e04fdcb27f9465b9446893f1c4e4b6b16bbbd69b2ee476dc4f83a// mouseover表示鼠标悬停在指定元素之上 mouseout表示鼠标从指定元素上移开 //jquery支持链式操作,多事件绑定时,事件名称之间使用空格分离。$('#title').bind('mouseover mouseout', function(){        if ($('ul').is(':hidden')) {            $('ul').css('display','block');        } else {            $('ul').css('display','none');        }    });  /*        unbind()方法        1.没有指定任何事件时 - 将指定元素的所有事件全部解绑定        2.指定一个事件名称时 - 将指定元素的指定当个事件解绑定        3.指定多个事件名称时 - 将指定元素的指定多个事件解绑定 */  $('#title').unbind('mouseover mouseout');
事件绑定方法的对比jquery中提供多组事件绑定与解绑定的方法
1.bind()与unbind() - jquery 3.0版本后删除方法
2.on()与off()方法 - jquery 1.7版本后新增方法
 其实bind()与unbind()的底层方法就是on()和off()
3.live()与die() - jquery 1.7版本后删除方法
 作用 - 实现事件委托
4.delegate()与undelegate() - jquery 1.6版本后新增方法,jquery
 3.0版本后删除方法
 作用 - 实现事件委托
5.one() - 为事件绑定一次性的函数
事件切换hover()方法jquery中提供了hover()方法模拟鼠标悬停事件效果。
$element.hover(over,out);
示例代码如下:
<style> #title { width: 100px; height: 20px; border: 1px solid black; } ul { list-style: none; padding: 0; display: none; } li { width: 100px; height: 20px; border: 1px solid black; } </style></head><body><p id="title">菜单</p><ul> <li>北京</li> <li>南京</li> <li>天津</li></ul><script> $('#title').hover(function(){ $('ul').css('display','block'); },function(){ $('ul').css('display','none'); });</script></body>
事件模拟jquery中提供了trigger()方法用于模拟除法匹配元素绑定的事件
$element.trigger(type[,dat]);
<body><button id="btn">按钮</button><script> // 绑定事件 - 由用户行为进行触发,调用处理函数 $('#btn').bind('click',function(){ console.log('this is button.'); }); // 模拟用户触发事件 $('#btn').trigger('click');</script></body>
相关推荐:
事件冒泡是什么如何用jquery阻止事件冒泡_jquery 
javascript/jquery键盘事件介绍
以上就是jquery的事件是什么?jquery事件的介绍的详细内容。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product