首页 > 代码库 > jquery的事件处理
jquery的事件处理
原生
//html<button id="btn">按钮</button>//jsdocument.getElementById(‘btn‘).onclick = clickCheckboxCallback;function clickCheckboxCallback(event) { var e = event || window.event; var target = e.target || e.srcElement; if (target.nodeName === ‘BUTTON‘) { alert(‘yuansheng ok‘); } else { alert(‘yuansheng fail‘); }}
此处 event、e 为 MouseEvent，target为button#btn
-----------------------------------------------------------------
jquery
//html<button id="btn">按钮</button>//js$(‘#btn‘).on(‘click‘, clickCheckboxCallback);function clickCheckboxCallback(event) { var target = event.target; if ($.nodeName(target, ‘button‘)) { alert(‘jquery ok‘); } else { alert(‘jquery fail‘); }}
此处 event为m.Event(jquery对象), target为button#btn
-------------------------------------------------------------
总结：jquery和原生js绑定事件的不同在于
1. 绑定方式
js为 dom.onclick = fn； jquery为$(‘#dom‘).on(‘click‘, fn);
2. 兼容处理
js 要经过 兼容处理，如下
var e = event || window.event;var target = e.target || e.srcElement;
jquery不用处理，只需要直接用event或者event.target，如下
var target = event.target;
*jquery 和 原生js的event不一样，但target都是一样的
3.对nodeName的判断，二者区别在上面的代码上可以看到
---------------------------------------------------------------------------
* Q:如何理解$符号？
A:直接写在$上的函数都只支持dom对象
jquery的事件处理
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。