javascript - 如何在 onclick 后禁用按钮但在另一个功能中？

Question

我有具有相同 onclick 功能的按钮。我希望一键后禁用按钮。onclick 函数需要执行多个函数，所以我怎样才能做到这一点。

 <input type="button" class="buttons" id="button2" value="2" 
    onclick="run()" />  

下面是其中一个按钮的代码，在 run 函数中是另一个正在运行的函数。

function disablebutton(button){
    this.disabled = true;
}

Answer 1

您只需要在不同的按钮上调用该功能。

        function disablebutton(buttonObject){
            buttonObject.disabled = true;
        }


        var button1 = document.getElementById('b1');
        var button2 = document.getElementById('b2');

        button1.onclick = function(){
          disablebutton(button1);
        }

         button2.onclick = function(){
          disablebutton(button2);
        }

或者

    <input type="button" class="buttons" id="button1" value="1" 
    onclick="run(this)" />  
    <input type="button" class="buttons" id="button2" value="2" 
    onclick="run(this)" /> 


    function run(button){
        button.disabled = true;
    }

Answer 2

您必须选择所有按钮，然后更改禁用属性。您可以通过向按钮添加一个类，在该类中选择它们然后循环，然后将它们全部禁用，如下所示：

var elems = document.getElementsByClassName("buttons");
for(var i = 0; i < elems.length; i++) {
    elems[i].disabled = true;
}

Answer 3

您可以调用disablebutton()内部run()函数或将其添加到run()函数之后onClick()：

<input type="button" class="buttons" id="button2" value="2" 
        onclick="run(); disablebutton(this)" />

// Or

<input type="button" class="buttons" id="button2" value="2" 
        onclick="run(this)" />

function run(thisButton) {
  console.log('run');
  disableButton(thisButton)
}

第一种解决方案：

function run() {
  console.log('run');
}

function disablebutton(button){
    console.log(button);
    button.disabled = true;
}

<input type="button" class="buttons" id="button2" value="2" 
    onclick="run(); disablebutton(this)" />

第二种解决方案：

function run(thisButton) {
  console.log('run');
  disablebutton(thisButton)
}

function disablebutton(button){
    console.log(button);
    button.disabled = true;
}

<input type="button" class="buttons" id="button2" value="2" 
        onclick="run(this)" />