javascript禁用按钮ondblclick与此

时间:2013-10-13 10:17:20

标签: javascript function onclick this

我有一个按钮,它有一个双击事件,我想运行,无论该按钮是启用还是禁用。我发布了一个关于此here的类似问题,但现在我需要从使用this参数的禁用按钮运行一个函数,如果我使用<span>解决方法,则如另一个问题是,它为我提供了有关<span>元素的信息,而不是<button>元素。

jsfiddle example

我怎样才能解决这个问题?

1 个答案:

答案 0 :(得分:0)

首先,您不能拥有两个具有相同ID的元素。你的标记看起来应该是这样的:

<button name='name_of_button' id='id_of_button1' ondblclick="runFunction( this );">Enabled Button</button>
<br>
<button name='name_of_button' id='id_of_button2' ondblclick="runFunction( this );" disabled>Disabled Button</button>

其次,使用内联javascript不是一个好主意。但是,您的问题可以解决:

HTML:

<div class="wrapper">
    <button name='name_of_button'>Enabled Button</button>
    <div class="over"></div>
</div>
<div class="wrapper">
    <button name='name_of_button' disabled="disabled">Disabled Button</button>
    <div class="over"></div>
</div>

JS:

window.onload = function() {
    var dblClicked = function() {
        console.log(this.parentNode.childNodes[1].removeAttribute("disabled"));
    }
    var overlays = document.querySelectorAll(".wrapper .over");
    for(var i=0; i<overlays.length; i++) {
        var over = overlays[i];        
        over.addEventListener("dblclick", dblClicked);
    }
}

http://jsfiddle.net/NRKLG/12/

如果元素被禁用,则无法触发事件。这意味着即使将侦听器添加到父元素,也无法监听dblclick。所以,你应该在按钮上放置一个覆盖透明div。