Question

theNewObject = {
  "count" : 1,
  "result" : [
  { "id": 2 }
 ]
}

我的html选择代码

<select id="title0">
   <option value="0">--- disable</option>
   <option value="1"> books</option>
</select>
<button id="save" type="submit">Save</button>

<select id="title1">
   <option value="0">--- disable</option>
   <option value="1"> books</option>
</select>
<button id="save" type="submit">Save</button>

谁有人帮我？我的第二个选择（id = title1）JavaScript不起作用。它仅影响前1（id = title0）。我想禁用第二个选择的按钮。

Answer 1

您的按钮 具有相同的ID （“保存”）。

也许您可以将ID更改为“save1”和“save2”？

<select id="title0">
   <option value="0">--- disable</option>
   <option value="1"> books</option>
</select>
<button id="save1" type="submit">Save</button>

<select id="title1">
   <option value="0">--- disable</option>
   <option value="1"> books</option>
</select>
<button id="save2" type="submit">Save</button>

然后您可以将您的javascript更改为：

$(document).ready(function(){

    $("#title0").change(function (){
        if($(this).val() === "0"){
            $('#save2').prop('disabled', true);
        }else{
            $('#save2').prop('disabled', false);
        }
    });

    $("#title1").change(function (){
        if($(this).val() === "0"){
            $('#save1').prop('disabled', true);
        }else{
            $('#save1').prop('disabled', false);
        }
    });
});

编辑：如果您想在启动时禁用该按钮，可以在最后添加.change方法，如下所示：

$(document).ready(function(){

    $("#title0").change(function (){
        if($(this).val() === "0"){
            $('#save2').prop('disabled', true);
        }else{
            $('#save2').prop('disabled', false);
        }
    }).change();

    $("#title1").change(function (){
        if($(this).val() === "0"){
            $('#save1').prop('disabled', true);
        }else{
            $('#save1').prop('disabled', false);
        }
    }).change();
});

这样，您可以定义“更改”事件应该发生的事情，然后立即执行它。打开页面时，按钮被禁用。如果从头开始设置disabled属性，也可以实现此目的。

Answer 2

您的标记无效，因为有两个元素具有相同的ID save。

设置不同的ID，即： save0和save1。

$(document).ready(function() {

  $("#title0").change(function() {
    if ($(this).val() === "0") {
      $('#save0').prop('disabled', true);
    } else {
      $('#save0').prop('disabled', false);
    }
  });

  $("#title1").change(function() {
    if ($(this).val() === "0") {
      $('#save1').prop('disabled', true);
    } else {
      $('#save1').prop('disabled', false);
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="title0">
   <option value="0">--- disable</option>
   <option value="1"> books</option>
</select>
<button id="save0" type="submit">Save</button>

<select id="title1">
   <option value="0">--- disable</option>
   <option value="1"> books</option>
</select>
<button id="save1" type="submit">Save</button>

如何禁用第二个选择选项？

2 个答案: