JS事件中的对象
在触发任何事件时都会产生一个对象。如:DOM事件,window事件等,都会产生一个对象,该对象就是当前元素的事件对象。
DOM事件对象
<body>
<input type="button" value="按钮" id="btn" />
<!--js-->
<script>
var btn = document.getElementById("btn");
btn.onmousemove = function(e){
alert(e.x);
}
btn.onclick = function(e){
document.write(e.type);
}
</script>
</body>
window事件对象
<body>
<!--js-->
<script>
window.onmousemove = function(e){
alert(e.x + "---" + e.y);
}
</script>
</body>
获取事件对象的相关属性和方法,在事件函数的参数中添加event参数(参数名没有严格要求,仅凭个人喜好),事件方法中用该参数调用相关属性及方法就行。
ps:补充事件对象的两个常用方法。
1、stopPropagation(); 阻止事件冒泡(阻止触发当前元素的父级元素);
2、preventDefault();阻止事件默认动作(如,<a></a>元素加上preventDefault后会阻止a标签默认的跳转动作)。
JS事件中的对象的更多相关文章
- js事件中绑定另一事件导致事件多次执行
1.html代码 <input type="button" value="add"> <input type="button&quo ...
- js事件中的event对象
addEvent(oDiv,"click",function(event){ console.log(event.bubbles+"事件是否冒泡"); cons ...
- 拼接的html的onclick事件中无法传递对象给js方法的处理办法
如下: 拼接的html: " onclick=\"valDocName2('"+JSON.stringify(doc).replace(new RegExp(" ...
- js事件3-事件对象
对于每次点击一个事件,都会产生一个事件对象,这个事件对象中包含了这个事件的很多信息 我们来看看事件对象具体有哪些信息 Object.onclick=function(e){ ..... }其中的参数e ...
- javacript onclick事件中传递对象参数
var user = {id:1, name:'zs', age:20}; var ele = '<a onclick="edit(' + JSON.stringify(user).r ...
- 小姐姐手把手教你JS数组中的对象去重
有时候数据库中的数据重复的,我们另一个需求需要数据的唯一性 那么这时候就用到这个方法了 我还是以截图的方式发粗来 不然太丑了 见谅 console.log(map)打印出来的结果已经帮我们把需要的 ...
- 在onclick事件中传递对象参数
1.传json对象 var obj = {id: 1, name: 'jimc', age: 20}; var jsonObj = '<a onclick="show(' + JSON ...
- JS——数组中push对象,覆盖问题,每次都创建一个新的对象
今天写运动框架时,发现将对象push进数组,后面的值会覆盖前面的值,最后输出的都是最后一次的值.其实这一切都是引用数据类型惹的祸. 如果你也有类似问题,可以继续看下去哦. 下面 ...
- ionic获取事件中的对象
ng-click="submit1($event, 'argsTest’)" $scope.submit1=function(event, args){ var target = ...
随机推荐
- 20145227 《Java程序设计》第2周学习总结
20145227 <Java程序设计>第2周学习总结 教材学习内容总结 3.1 类型.变量与运算符 1.基本类型:在java中基本类型主要分为整数.字节.浮点数.字符与布尔. 整数:分为s ...
- ACM题目————小A的计算器
Description 以往的操作系统内部的数据表示都是二进制方式,小A新写了一个操作系统,系统内部的数据表示为26进制,其中0-25分别由a-z表示. 现在小A要在这个操作系统上实现一个计算器,这 ...
- JavaScript中创建类,赋值给ajax中的data参数
缘由:因为要给根据是否选中checkbox来动态增加ajax中data的属性(ajax的data属性格式的几种方法,参考http://www.jb51.net/article/46676.htm) d ...
- 【转】在Eclipse中配置tomcat
转载地址: http://kin111.blog.51cto.com/738881/163096 为了在Eclipse中进行struts2的测试,才发现自己机器上的Eclipse没有集成Tomcat, ...
- MNIST手写数字数据库
手写数字库很容易建立,但是总会很浪费时间.Google实验室的Corinna Cortes和纽约大学柯朗研究所的Yann LeCun建有一个手写数字数据库,训练库有60,000张手写数字图像,测试库有 ...
- easyui datebox 只选择年月
//将日期输入框变为年月的函数方法 var month=0; $('#effectiveDate').datebox({ onShowPanel: function () ...
- reactjs入门到实战(五)---- props详解
1>>>基础的props使用 不可修改父属性 getDefaultProps 对于外界/父组件的属性值,无法直接修改,它是只读的. <script type= ...
- Codeforces Round #370 (Div. 2) B
Description Memory is performing a walk on the two-dimensional plane, starting at the origin. He is ...
- 2016年10月16日 星期日 --出埃及记 Exodus 18:27
2016年10月16日 星期日 --出埃及记 Exodus 18:27 Then Moses sent his father-in-law on his way, and Jethro returne ...
- linux 强大的编辑器之vi
vi编辑器是一个处理ASCII数据的文本工具.大多数linux发行版都已经默认安装了vi编辑器.vi是visual interface的缩写vim是 visual interface improved ...