javascript的自定义对象/取消事件/事件兼容性/取消冒泡

Posted zhangzonghua

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript的自定义对象/取消事件/事件兼容性/取消冒泡相关的知识,希望对你有一定的参考价值。



<!
DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>自定义对象</title> <!-- 自定义对象是一种特殊数据类型,由属性和方法封装而成. --> <script type="text/javascript"> function method1() { var person=new Object(); //添加属性 person.name=" 瑞兹 "; person.spell=957; //添加方法1. person.say=new Function("alert(‘ person.name ‘)"); //添加方法2. person.way=way; function way(){ var num=0; for(var i=0;i<100;i++){ num+=i; } alert(num); } } /* 构造器 创建对象 */ function person(name,age){ //定义属性 this.name=name; this.age=age; //定义成员方法: this.sayName=function(){ alert(this.name); } } function method2(){ var p=new person(); //通过构造器创建对象 } /* JSON 是一种轻量级的数据交换格式 : -使用 键值对 形式定义 -名称需要用双引号 “” 引起来 -多个对定义之间 使用 ,隔开 */ function method3(){ var p={"name":"张韶涵","age":30,"say":function(){alert("看得最远的地方")}}; } </script> </head> <body> <input type="button" onclick="method1();" value="创建通用对象模板!"> <input type="button" onclick="method2();" value="创建对象模板!"> <input type="button" onclick="method3();" value="创建JSON对象模板!"> </body> </html>

2.取消事件:

 

<!DOCTYPE html>
<html>
<head> <meta charset="UTF-8"> <title>取消事件写法</title> <script type="text/javascript"> function judge(){ var result =confirm(确定要删除吗?); return result; } </script> <body> <form> <input type="text" value="我是要提交的数据"> <input type="submit" value="删除" onclick="judge();"> </form> </body> </head>
</html>

 

3.事件兼容性

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>取消事件写法</title>
    <script type="text/javascript">
  function fun(e){
     console.log(event.clientX+‘,‘+event.clientY);//获取点击时的位置,单位是像素,次写法可能出现不兼容问题
//不兼容的提示:reffereceError event is not defined
// 兼容写法如下:
 console.log(e.clientX+‘,‘+e.clientY);
/* 获取事件源的写法(即事件的目标节点)
  IE:event.srcElement
  Fire Fox: event.target
*/
console.log(event.srcElement);
console.log(event.target);
// 兼容写法:
  var evesrc=event.srcElement||event.target;
console.log(evesrc.nodeName);
}
</script>
<body> <p onclick="console.log(event.clientX);">
  HTML使用
</p>
 <p onclick="fun(event);">
  JS使用
</p>
</body>
</head>
</html>

 























以上是关于javascript的自定义对象/取消事件/事件兼容性/取消冒泡的主要内容,如果未能解决你的问题,请参考以下文章

自定义DOM事件函数封装

JavaScript自定义事件监听

javascript中带有自定义触发器的自定义事件

webkit iOS 5上的自定义Javascript事件不起作用

Webkit iOS 5上的自定义Javascript事件不起作用

使用 ajax 调用处理新对象创建的自定义事件?