一次覆盖javascript点击事件

时间:2012-07-18 13:08:29

标签: javascript jquery html

我想替换网页中所有锚点的click事件的默认操作。 当我使用这段代码时:

<html> <head> <script>     
var list=document.getElementsByTagName("a");
var isChecked = false;

function load () {    
    for (i=0; i<list.length; i++)
    {
        var old = (list[i].onclick) ? list[i].onclick : function () {}; 
        list[i].onclick = function () {                 
        if( !isChecked)
        {
            test(); 
            old();
        }
        else
            old();
        };  
    }
}    
function test() {
    alert("new action");
    isChecked = true;
}     
</script> </head> 
<body onload="load();">     
<a id="nr_1" onClick="alert('test');"> Anchor 1 </A>
<a id="nr_2" onClick="alert('test2');"> Anchor 2 </A>      
</body> </html>

当我单击一个锚点时,我会从测试函数中获取警报,然后是第二个锚点的默认函数(即使我单击第一个锚点)。当我再次单击两个锚点中的一个时,我总是从第二个锚点获取警报。 如何为每个锚元素放回原始的onclick函数?当有人在jquery中有解决方案时,我也会很高兴。

修改

我使用此代码成功了:

function load()
{
$('a').attr('disabled', 'disabled');

$('a').click(function(e){
    if($(this).attr('disabled'))
    {
    alert("new");
    e.preventDefault(); 
    $('a').removeAttr("disabled");  
    this.click();
    }
});
}

在加载页面时,调用此函数,为所有锚元素提供“禁用”属性。单击元素后,e.preventDefault()函数将禁用内联onclick函数。然后我删除“禁用”属性并再次调用元素的单击功能。因为现在元素没有“禁用”属性,只执行默认功能。我仍然对这个问题的“更优雅”解决方案持开放态度,但现在我是一个快乐的露营者!

1 个答案:

答案 0 :(得分:2)

如果使用jQuery,可以将一次性处理程序与持久处理程序结合使用:

.one().on()

的文档

工作示例:http://jsfiddle.net/Q8gmN/

示例HTML:

<input type="button" id="click" value="click" />

示例JavaScript:

button.one('click', function () {
  console.log('one time function fired');  
});

button.on('click', function () {
  console.log('persistent function fired');  
});