javascript - onclick 事件点击将ask()直接写入和调用的区别
本文介绍了javascript - onclick 事件点击将ask()直接写入和调用的区别的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
window.onload=init;
function init(){
var x=document.getElementsByTagName('a');
for(var i in x){
x[i].onclick=function(){
return confirm('are you sure?');
}
}
}
可以直接运行成功
但是将其写成以下形式不能正确运行,return false 没有被捕获,当点击取消时,链接仍然跳转 ,这是为什么?
函数如下:
window.onload=init;
function init(){
var x=document.getElementsByTagName('a');
for(var i in x){
x[i].onclick=function(){
ask();
}
}
}
function ask(){
return confirm('are you sure?');
}
写成如下形式可以正确运行:
window.onload=init;
function init(){
var x=document.getElementsByTagName('a');
for(var i in x){
x[i].onclick=ask;
}
}
function ask(){
return confirm('are you sure?');
}
求教三种写法的区别
解决方案
首先题主先要知道 confirm('are you sure?')
点确定
会返回true
,点返回
会返回false
;
然后再说三种写法并没有实质上的区别,只是变着花样返回值而已:
1.你懂
2.ask() 改为 return ask();
3.三种中最好的写法
另外
看题主在研究事件绑定,如果是给一堆有规则的元素,如列表li绑定事件,最好的办法叫
事件委托
:
<ul id="ul">
<li>aaaaaaaa</li>
<li>bbbbbbbb</li>
<li>cccccccc</li>
</ul>
window.onload = function(){
var oUl = document.getElementById("ul");
var aLi = oUl.getElementsByTagName("li");
for(var i=0; i<aLi.length; i++){
aLi[i].onmouseover = function(){
this.style.background = "red";
}
aLi[i].onmouseout = function(){
this.style.background = "";
}
}
}
再搞懂js的事件机制,捕获和冒泡的话,就差不多了。
最后兼容性什么的IE:attachEvent,标准:addEventListener
这篇关于javascript - onclick 事件点击将ask()直接写入和调用的区别的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文