Question

好的，我有两个HTML选择元素和一个按钮。我需要禁用该按钮，除非两个的选择器都有任何默认（na）值。

到目前为止我已经得到了这个，但它并没有真正起作用。我错过了什么？

JS

function toggleBtn() {
    if($(".mySelect").val() == "na") {
        $(this).parents("td").find("input:button").attr("disabled", "disabled");    
    } else {
        $(this).parents("td").find("input:button").attr("disabled", "");    
    }
});

toggleBtn();

$(".mySelect").change(toggleBtn());

HTML

<table>
<tr>
  <td>
    <select class="mySelect">
      <option value="na"></option>
      <option value="1">value 1</option>
      <option value="2">value 2</option>
    </select> 

    <select class="mySelect">
      <option value="na"></option>
      <option value="3">value 3</option>
      <option value="4">value 4</option>
    </select> 
  </td>
</tr>
<tr>
  <td>
    <input type="button" value="click me">
  </td>
</tr>
</table>

Answer 1

我不确定您是否理解$('.mySelect')是多个<select>的集合，因此在其上调用.val()仅返回集合中第一个的值。这样的事情对你有用：

var selects = $('.myChange');
var button = $('table td input:button');

selects.change(function() {

    var defaultVal = true;

    selects.each(function(index, el) {
        if ($(el).val() == 'na') defaultVal = true;
    });

    button.attr('disabled', defaultVal ? 'disabled' : '');

});

任何时候<select>中的一个被更改，我们循环遍历所有这些，看看是否有任何'na'值，如果是，我们禁用该按钮。

Answer 2

克里斯打败了我，我的版本就是这个。

循环浏览所有选项，如果找到不是'na'的选项，请禁用您的选择按钮并停止循环。您需要停止循环，或者最后一个元素基本上决定了按钮的行为方式。

function toggleBtn() {
     var inputButton =  $('input[type="button"]').first();   
     inputButton.attr('disabled', null);
     $(".mySelect").each(function(index, element) {
        if ($(this).val() != 'na') {
            inputButton.attr('disabled', 'disabled');
            return false
            }
    });
 }
$(document).ready(function(e) {
    toggleBtn();
    $(".mySelect").change(toggleBtn);
    });

将其插入脚本标题，看看会发生什么。这似乎跨浏览器工作，我们正在使用attr ......

Answer 3

$(obj).attr('disabled', true);

Answer 4

您可以使用按钮的ID。只需为按钮指定一些id，然后根据id启用和禁用。

var buttons = $('#button1,#button2,#button3');
buttons.click(function(){
  buttons.(this).attr('disabled',true);
});

Answer 5

jsFiddle example 怎么样？

jQuery的：

function toggleBtn() {
    if ($(".mySelect:eq(0)").val() == "na" || $(".mySelect:eq(1)").val() == "na") {
        $('input[type="button"]').attr("disabled", true);
    } else {
        $('input[type="button"]').attr("disabled", false);
    }
};
$(".mySelect").change(function() {
    toggleBtn();
});
toggleBtn();

Answer 6

这对我有用：

<强> HTML：

<table>
<tr>
  <td>
    <select class="mySelect">
      <option value="na"></option>
      <option value="1">value 1</option>
      <option value="2">value 2</option>
    </select>

    <select class="mySelect">
      <option value="na"></option>
      <option value="3">value 3</option>
      <option value="4">value 4</option>
    </select>
  </td>
</tr>
<tr>
  <td>
    <input type="button" value="click me" disabled="disabled">
  </td>
</tr>
</table>

<强> SCRIPT：

$(".mySelect").change(function () {
    var buttonstate = 0;
    $('.mySelect').each(function () {
        if ($(this).val() != 'na') {
            buttonstate++;
        }
    });
    if (buttonstate == 2) {
        $(this).parent().parent().parent().find('input:button').attr("disabled", "");
    } else {
        $(this).parent().parent().parent().find('input:button').attr("disabled", "disabled");
    }
});

您可以在此处测试：http://jsfiddle.net/tF8xc/13/

除非机器人选择器具有值，否则禁用按钮

6 个答案: