1. js 判断是否存有事件 addeventlistener
原生实现无法判断是否有事件。如果确实需要请参照以下代码,另外本代码只使用于调用dom2形式加载或者移除事件功能,对应dom0类型的没有做测试。
以下代码修改了原生的Element对象,是否需要这样做,请自己酌情处理。
<!DOCTYPEhtml>
<html>
<headlang="en">
<metacharset="UTF-8">
<title></title>
<scripttype="text/javascript">
/**
*此处代码必须放到任何javascript代码之前。另外增加事件只能用addEventListener形式。
*/
(function(){
Element.prototype.eventListenerList={};
Element.prototype._addEventListener=Element.prototype.addEventListener;
Element.prototype._removeEventListener=Element.prototype.removeEventListener;
Element.prototype.addEventListener=function(a,b,c){
this._addEventListener(a,b,c);
if(!this.eventListenerList[a])this.eventListenerList[a]=[];
this.eventListenerList[a].push(b);
};
Element.prototype.removeEventListener=function(a,b,c){
this._removeEventListener(a,b,c);
if(this.eventListenerList[a]){
vararr=this.eventListenerList[a];
for(vari=0;i<arr.length;i++){
if(arr[i].toString()===b.toString()){
this.eventListenerList[a].splice(i,1);
}
}
}
}
})();
//此后为测试代码。
window.onload=function(){
vardom=document.getElementById("test");
//增加三个监听
dom.addEventListener("click",function(){
console.info("clickfunction");
},false);
dom.addEventListener("click",function(){
console.info("clickfunction2");
},false);
dom.addEventListener("click",function(){
console.info("clickfunction3");
},false);
console.log(dom.eventListenerList["click"].length);
//读出监听的方法
varclicks=dom.eventListenerList.click;
if(clicks)clicks.forEach(function(f){
console.log("Ilistentothisfunction:"+f.toString());
});
//删除监听
dom.removeEventListener("click",function(){
console.info("clickfunction");
},false);
console.log(dom.eventListenerList["click"].length);
};
</script>
</head>
<body>
<buttonid="test">测试</button>
</body>
</html>
2. js里面如何判断按钮触发了哪个事件
onmouseover="test(event)";
js改下
function test(e){
var type=e.type ;//type就等于 mouserover或者mouseout
}
3. js如何实现submit的点击事件判断是否触发表单提交
submit只是表单提交来时的验证事源件,无法获取提交是否成功
return false阻止表单提交,自己写ajax提交表单内容
$("#xxx").submit(function () {
$.ajax({ type: 'POST', data: $(this).val(), url: 'xxxx',
success: function () { //...
},
error: function (xhr) {
//...
}
});
return false;
});
4. JS如何判断鼠标滚轮事件分析
我们都见到过这些效果,用鼠标滚轮实现某个表单内的数字增加减少操作,或者滚轮控制某个按钮的左右,上下滚动。这些都是通过js对鼠标滚轮的事件监听来实现的。今天这里介绍的是一点简单的js对于鼠标滚轮事件的监听。先分析原理:我们是通过判断鼠标滚动的获取一个值,然后根据这个值判断滚动的方向。然而不同浏览器有不同的获取方法,所以要分浏览器写方法。 不同浏览器不同的事件 首先,不同的浏览器有不同的滚轮事件。主要是有两种,onmousewheel(firefox不支持)和DOMMouseScroll(只有firefox支持),关于这两个事件这里不做详述,想要了解的朋友请先去了解鼠标滚轮(mousewheel)和DOMMouseScroll事件。过程中需要添加事件监听:兼容firefox采用addEventListener监听。 js返回数值判断滚轮上下 判断滚轮向上或向下在浏览器中也要考虑兼容性(IE、Opera、Safari、Firefox、Chrome)中Firefox 使用detail,其余四类使用wheelDelta;两者只在取值上也是不一致,但是含义一致,detail与wheelDelta只各取两个 值,detail只取±3,wheelDelta只取±120,其中正数表示为向上,负数表示向下。 具体的代码如下所示: <label for=wheelDelta滚动值:</label(IE/Opera)<input type=text id=wheelDelta/ <label for=detail滚动值:(Firefox)</label<input type=text id=detail/ <script type=text/javascript var scrollFunc=function(e){ e = e || window.event; var t1=document.getElementById(wheelDelta); var t2=document.getElementById(detail); if(e.wheelDelta){//IE/Opera/Chrome t1.value=e.wheelDelta; }else if(e.detail){//Firefox t2.value=e.detail;}} /*监听事件*/