javascript - 单击一个按钮时如何禁用多个按钮

Question

我目前有两个按钮，当单击其中一个时，我希望将两者都禁用。

目前我正在使用：

<button type="button" class="disapprove-button" id="123abc" onclick="this.disabled=true;">
<img src="/downvote.png" alt="Downvote" /></button>

单击时禁用按钮，但这允许另一个按钮保持活动状态。

另一个是几乎完全相同的代码，但功能不同：

<button type="button" class="approve-button" id="123abc" onclick="this.disabled=true;">
<img src="/upvote.png" alt="Upvote" /></button>

我知道他们用 javascript/jquery 做到这一点的方法，但我对这两个不是很熟悉。

Answer 1

首先，你不能给不同的元素赋予相同的id，id是唯一的。你可以分配一个共同的类，但不能分配共同的id。

工作小提琴

只是一个样本。

$('#upvote_id').on('click', function() {
     $('#down_vote_id').attr('disabled', 'disabled');
     $('#upvote_id').attr('disabled', 'disabled');
});

Answer 2

1）为按钮制作不同的ID。

var buttons =  $("#id_button1, #id_button_2");//find buttons in DOM

buttons.click(function(){
  buttons.prop("disabled", true);//disable both buttons onclick event
})

http://jsfiddle.net/A3W8T/

回答评论：是的，您可以使用任何选择器：

var buttons =  $(".disapprove-button, .approve-button");//find buttons in DOM

buttons.click(function(){
  buttons.prop("disabled", true);//disable both buttons onclick event
})

Answer 3

我改用了类定位

var voteB =  $(".disapprove-button, .approve-button");

$(voteB).on('click', function() {
     $(voteB).attr('disabled', 'disabled');
});

工作示例http://jsfiddle.net/imemine29/VFt9E/