很多情况下,比如我们想对一个文本框或者按钮进行事件绑定的时候,一般直接在他上面写上什么onclick等等的事
件,但是对于这样的时间的去除,比如希望一个按钮在这里仅仅按下一次,然后再次按下的时候就不能有什么效果了,
这就需要对事件 的监听和绑定还有取消实行动态的机制,下面我们来演示一个小例子来说明一下事件的绑定和取消机
制/
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test6.html</title>
<script type="text/javascript">
function test(){
window.alert("您投了一次票");
document.getElementById("1").detachEvent("onclick",test);
}
</script>
</head>
<body>
<input type="button" value="投票" id="1"/>
<script type="text/javascript">
document.getElementById("1").attachEvent("onclick",test);
</script>
</body>
</html>
这里使用document.getElementById("1").attachEvent("onclick",test);进行动态的事件绑定,使用
document.getElementById("1").detachEvent("onclick",test)进行动态的时间的取消,这样就实现了这个事件只能相应一次,下
次再点击这个按钮的时候就不会再产生什么效果。
下面再演示一个时时监听键盘事件,判断输入的是否是数字,如果不是数字直接动态提示,然后拒绝其输入
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test7.html</title>
<script type="text/javascript">
function test(event){
//用户每按下一个按键,就去判断是不是数字
if(event.keyCode<48 || event.keyCode > 57){
window.alert("您输入的不是一个数字");
return false;
}
}
</script>
</head>
<body>
<input type="text" onkeypress="return test(event);" />请输入数字
</body>
</html>
这里的event就是一个事件对象,他能返回很多的信息,具体请参考文档。
分享到:
相关推荐
计算机后端-Java-油管上最火的Web前端教程18 JavaScript 常用事件绑定、事件监听实战
本文实例讲述了javascript事件监听与事件委托。分享给大家供大家参考,具体如下: 事件监听与事件委托 在js中,常用到element.addEventListener()来进行事件的监听。但是当页面中存在大量需要绑定事件的元素时,这种...
在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定、事件监听、事件委托(事件代理)等。这些名词是什么意思呢,有什么作用呢? 事件绑定 要想让 JavaScript 对用户的操作作出响应,首先...
主要为大家详细介绍了JavaScript绑定事件监听函数的通用方法,感兴趣的朋友可以参考一下
本文实例讲述了JavaScript为事件句柄绑定监听函数的方法。分享给大家供大家参考,具体如下: 在JavaScript中为Dom元素绑定事件监听函数是一件非常常见的事情,但这里也有许多的Bug。各种浏览器对于事件绑定都提供了...
主要介绍了JavaScript实现为事件句柄绑定监听函数的方法,结合实例形式分析了javascript事件绑定的常用技巧与注意事项,需要的朋友可以参考下
JavaScript绑定大事监听函数的通用方法_.docx
最近收集了一些关于JavaScript绑定事件的方法,汇总了一下,不全面,但是,希望便于以后自己查看。 JavaScript中绑定事件的方法主要有三种: 1 在DOM元素中直接绑定 2 JavaScript代码中直接绑定 3 绑定事件监听函数 ...
关于js中的事件监听大家用的比较多了,无非是判断...主要代码: 代码如下:/*绑定事件与取消绑定*/var handleHash = {};var bind = (function() { if (window.addEventListener) { return function(el, type, fn, cap
JQuery绑定事件四种实现方法解析 jQuery提供了多种绑定事件的方式...在开始看他们之前 一:bind(type,[data],function(eventObject)) bind是使用频率较高的一种,作用就是在选择到的元素上绑定特定事件类型的监听函
实现一个简单的on和off方法 ... Event.addEvent: 调用底层的addEventListener添加监听事件 Event.delegateHandle: 当发生事件之后,随着事件的冒泡上升,判断存在事件委托的元素,并执行对应的回调函数 addEvent / off
本文实例讲述了Javascript添加监听与删除监听的用法。分享给大家供大家参考。具体分析如下: js中事件监听就是利用addEventListener来绑定一个事件,这个用法在jquery中非常常用并且简单,但在原生js中比较复杂,...
数据影响视图视图影响数据 数据影响视图 视图影响数据 如果已经学过Vue,并且深入了解过Vue的双向数据绑定的话,就会明白 Vue 2.0 双向数据绑定的核心其实是通过Object.defineProperty来实现数据劫持和监听。...
vue实现简易的双向数据绑定 ... 解析器Compile 解析指令, 更新模板数据, 初始化视图, 实例化一个订阅者, 将更新函数绑定到订阅者上, 可以在接收通知二次更新视图, 对于v-model还需要监听input事件,实现视图到模型
本文实例讲述了JavaScript函数绑定。分享给大家供大家参考,具体如下: Perface 如果让你实现这个页面和一些操作的,比如点击1、2、3等就在那个input text中显示,还有删除功能,拨打我们先不要管它,只是模拟而已...
<h2>javascript 事件 <li>aaaa <li>aaaa111 <li>aaaa222 <li>aaaa3333 <li>aaaa444 [removed] //获取所有li的节点 var list = document.getElementsByTagName(li); //给每个li绑定事件 for(var i = 0;i<list....
arcgis-js-事件基于 esri 支持博客文章地图事件示例此示例使用作为构建工具,包括 linting 任务。尝试一下。指示您需要安装和才能通过命令行下载依赖项并构建应用程序。 cd进入arcgis-js-events文件夹运行npm ...