js函数中onmousedown和onclick的区别和联系探讨
这两个事件很常见。
了解这两个事件的区别,但是实际并没有使用到这两个事件的区别去做一些操作。
通常使用onclick的时候也可以使用onmousedown,使用onclick的时候更多一些。
今天碰到了非使用onmousedown不可的时候,故特此记录。
先说一下区别:onclick是在鼠标点击弹起之后触发的事件。onmousedown是在鼠标按下之后触发的事件。
简单的说onclick = onmousedown + onmouseup;
如果在某个地方按下鼠标后移开鼠标在另外一个地方松开鼠标会触发onmousedown事件,但是onclick事件却不会被触发。
我们今天要实现的功能是点击a标签,切换到另外一个页面,在原页面关闭之前需要触发一个函数。不是windowunload。
之前使用的是onclick事件,IE中测试无问题,但是在FF中测试发现,在页面被销毁之前还没有来得及执行这个函数。
如果使用onmousedown事件,虽然也没有办法保证该函数一定被执行,但是为该函数的执行争取了一定的时间,因为跳转是在鼠标弹起之后执行的。
解决办法一:onclick="return test()",当且仅当当该函数返回true之后才执行跳转。这样导致了一个新的问题。如果我们在test函数中执行了多线程程序或者新开线程的程序后,会先返回true,跳转,新开的线程就没有被执行。如下面的函数:
代码如下:
function test()
{
(new Image()).src="1.html";
window.open("1.html","_new");
//alert("ok");
return true;
}
我在1.html文件中设置了<body onload="javascript:alert('ok')">,当1.html并没有被完全渲染结束时,跳转已经执行了。new image函数也没有保证已经被执行了。
在使用单一线程执行函数时,可使用return test()这种方法。
解决办法二:估计一下test函数的多线程函数的最长执行速度,加入执行时间为100.不在a标签中使用跳转。在test函数中使用setTimeout(location.href="1.html",100)来执行跳转。
相关推荐
-
javascript当onmousedown、onmouseup、onclick同时应用于同一个标签节点Element
因为在JavaScript中,mousedown.mouseup.click执行顺序是从左到右的,更重要的是一旦mousedown事件激活,正常情况(不在mousedown事件中绑定的方法使用alert类似方法,因为弹出对象框就阻止了事件传递,即后续调用事件丢失)下后面两个事件也肯定会被激活.平时我们在一个标签上只绑定一个click事件,其实触发click事件也都调用了mousedown.mouseup等事件,只是它们调用周期极短,而且我们又没有编写相关函数与这两个事件绑定,所以不会觉察到.现在
-
js函数中onmousedown和onclick的区别和联系探讨
这两个事件很常见. 了解这两个事件的区别,但是实际并没有使用到这两个事件的区别去做一些操作. 通常使用onclick的时候也可以使用onmousedown,使用onclick的时候更多一些. 今天碰到了非使用onmousedown不可的时候,故特此记录. 先说一下区别:onclick是在鼠标点击弹起之后触发的事件.onmousedown是在鼠标按下之后触发的事件. 简单的说onclick = onmousedown + onmouseup; 如果在某个地方按下鼠标后移开鼠标在另外一个地方松开鼠标
-
JavaScript中click和onclick本质区别与用法分析
本文实例讲述了JavaScript中click和onclick本质区别与用法.分享给大家供大家参考,具体如下: 原生javascript的click在w3c里边的阐述是DOM button对象,也是html DOM click() 方法,可模拟在按钮上的一次鼠标单击. button 对象代表 HTML 文档中的一个按钮.button元素没有默认的行为,但是必须有一个 onclick 事件句柄以便使用. 语法:buttonObject.click() <html> <head> &l
-
浅谈python socket函数中,send与sendall的区别与使用方法
在python socket编程中,有两个发送TCP的函数,send()与sendall(),区别如下: socket.send(string[, flags]) 发送TCP数据,返回发送的字节大小.这个字节长度可能少于实际要发送的数据的长度.换句话说,这个函数执行一次,并不一定能发送完给定的数据,可能需要重复多次才能发送完成. 例子: data = "something you want to send" while True: len = s.send(data[len:]) if
-
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
定义 function Person(national,age) { this.age = age; //实例对象,每个示例不同 Person.national = national; //类对象,所用实例公用 var bb = 0; //局部变量,外面不能访问(类似局部函数) } 调用 var p = new Person("中国", 29); document.writeln("age:" + p.age); document.writeln("obj
-
浅谈js函数的多种定义方法与区别
定义一个函数一般有如下三种方式: 1.函数关键字(function)语句: function fnMethodName(x){ alert(x); } 2.函数字面量(Function Literals): var fnMethodName = function(x){alert(x);} 3.Function()构造函数: var fnMethodName = new Function('x', 'alert(x);') 上面三种方法定义了同一个方法函数fnMethodName,第1种就是最常
-
通过实例了解js函数中参数的传递
先看一道JS的笔试题: var setObj=function(o){ o.name="xiaoming"; o={}; o.name="xiaohong"; } var p={name:"xixi",age:24}; setObj(p); console.log(p); 答案是{name:xiaoming,age24}: 在JavaScript中函数参数默认为引用类型. 一.函数传递值类型: 代码实例如下: function addNum(nu
-
thinkPHP js文件中U方法不被解析问题的解决方法
本文实例分析了thinkPHP js文件中U方法不被解析问题.分享给大家供大家参考,具体如下: 我想在js文件中写ajax, 写完发现异常, 本以为是js文件中不支持ajax 后来发现时地址解析错误. 也就是U方法在js文件中不被解析. 貌似thinkphp解析,tpl文件中的一些元素. js文件中的ajax function ajaxCheckTel(tel,id){ var res = ''; $.ajax({ type:"post", url:ajaxurl, // 地址解析有误
-
js函数内变量的作用域分析
本文实例分析了js函数内变量的作用域.分享给大家供大家参考.具体分析如下: 先看一个函数实例: 复制代码 代码如下: <html> <head> </head> <body> <script type="text/javascript"> var a = 5; var c = 3; function t(){ var a = 6; var b = 10; document.write(a+'-----'+b); doc
-
深入浅析javascript函数中with
/*js函数中with函数的用法分析 定义 方便用来引用某个对象中已有的属性 但是不能用来给对象添加属性 要给对象创建 新的属性 必须明确的引用该对象*/ 代码格式 with(object) statements object:新的默认对象 statements:一个或多个语句 oject是该语句的默认对象 with 语句通常用来缩短特定情形下必须写的代码量. x = Math.cos(3 * Math.PI) + Math.sin(Math.LN10) y = Math.tan(14 * Ma
-
JS中创建函数的三种方式及区别
1.函数声明 function sum1(n1,n2){ return n1+n2; }; 2.函数表达式,又叫函数字面量 var sum2=function(n1,n2){ return n1+n2; }; 两者的区别:解析器会先读取函数声明,并使其在执行任何代码之前可以访问:而函数表达式则必须等到解析器执行到它所在的代码行才会真正被解释执行. 自执行函数严格来说也叫函数表达式,它主要用于创建一个新的作用域,在此作用域内声明的变量,不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,
随机推荐
- Ajax案例集下载:新增分页查询案例(包括《Ajax开发精要》中的两个综合案例) 下载
- 腾讯与新浪的通过IP地址获取当前地理位置(省份)的接口
- 详解vue数据渲染出现闪烁问题
- Vue.js学习之计算属性
- 常用的正则表达式集锦
- PHP 正则表达式效率 贪婪、非贪婪与回溯分析(推荐)
- Linux之定时任务Crond详解
- Tomcat服务器搭建教程
- Java常见基本数据结构概览
- c# indexof 用法深入理解
- JavaScript模拟重力状态下抛物运动的方法
- jQuery remove()过滤被删除的元素(推荐)
- Python设计模式之单例模式实例
- JSP简明教程
- JSP中内建exception对象时出现500错误的解决方法
- linux平台编译安装PHP7并安装Redis扩展与Swoole扩展实例教程
- Shell脚本批量重命名文件后缀的3种实现
- 通过备份记录获取数据库的增长情况
- mysql 队列 实现并发读
- jQuery中绑定事件的命名空间详解