Question

在下面的if条件中，我在下面的下拉选项（id =“store_machine”）中需要master和salve的id（id =“store_id”）很少。否则只有主人。我使用的是开关案例，其中特定的id将会出现，然后主要和salve都应该来，除了只有主人

<tr>
<td>
    <b>Store ID</b>
    <br>
</td>
<td>
    <input type="number"  id="store_id" readonly>
    <br>
</td>
</tr>
<tr>
<td>
    <b>Machine</b>
    <br>
</td>
<td>
    <select name="select-native-3" id="store_machine" data-iconpos="left">
        <option value="Master">Master</option>
        <option value="Slave">Slave</option>
    </select>
    <br>
</td>
</tr>



<script type="text/javascript">
$(function () {
    $('#store_id').on('change', function () {
        $('#store_machine').empty();
        switch ($(this).val()) {
            case "1425427806":
                $('#store_machine')
                    .append($('<option value=""></option>'))
                    .append($('<option value="Master">Master</option>'))
                    .append($('<option value="Slave">Slave</option>'));
                break;

            case "1452469394":
                $('#store_machine')
                    .append($('<option value=""></option>'))
                    .append($('<option value="Master">Master</option>'))
                    .append($('<option value="Slave">Slave</option>'));
                break;

            case "1489455419":
                $('#store_machine')
                    .append($('<option value=""></option>'))
                    .append($('<option value="Master">Master</option>'))
                    .append($('<option value="Slave">Slave</option>'));
                break;

            case "1415643163":
                $('#store_machine')
                    .append($('<option value=""></option>'))
                    .append($('<option value="Master">Master</option>'))
                    .append($('<option value="Slave">Slave</option>'));
                break;
            default:
                $('#store_machine')
                    .append($('<option value="">Select Machine</option>'))
                    .append($('<option value="Master">Master</option>'));
        }
    });
});

</script>

我在错误的地方需要帮助。谢谢

Answer 1

您的代码中存在许多错误。列出它们很难，所以只需检查下面的固定代码即可。我删除了readonly上的input属性，因此我们可以在那里输入数据。

(function() {
  $('#store_id').on('change', function() {
    $('#store_machine').empty();

    switch ($(this).val()) {
      case "1425427806":
        $('#store_machine')
          .append($('<option value=""></option>'))
          .append($('<option value="Master">Master</option>'))
          .append($('<option value="Slave">Slave</option>'));
        break;
      case "1452469394":
        $('#store_machine')
          .append($('<option value=""></option>'))
          .append($('<option value="Master">Master</option>'))
          .append($('<option value="Slave">Slave</option>'));
        break;
      case "1489455419":
        $('#store_machine')
          .append($('<option value=""></option>'))
          .append($('<option value="Master">Master</option>'))
          .append($('<option value="Slave">Slave</option>'));
        break;
      case "1415643163":
        $('#store_machine')
          .append($('<option value=""></option>'))
          .append($('<option value="Master">Master</option>'))
          .append($('<option value="Slave">Slave</option>'));
        break;
      default:
        $('#store_machine')
          .append($('<option value="">Select Machine</option>'))
          .append($('<option value="Master">Master</option>'));
    }
  });
})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
  <td>
    <b>Store ID</b>
    <br>
  </td>
  <td>
    <input type="number" id="store_id" />
    <br>
  </td>
</tr>
<tr>
  <td>
    <b>Machine</b>
    <br>
  </td>
  <td>
    <select name="select-native-3" id="store_machine" data-iconpos="left">
            <option value="Master">Master</option> 
            <option value="Slave">Slave</option>
        </select>
    <br>
  </td>
</tr>

我不知道你为什么要使用相同代码的所有案例。除非那只是一个测试，你将改变它以为每个案例提供不同的代码，否则你可以完全折叠它们并使用相同的代码：

(function() {
  $('#store_id').on('change', function() {
    $('#store_machine').empty();

    switch ($(this).val()) {
      case "1425427806":
      case "1452469394":
      case "1489455419":
      case "1415643163":
        $('#store_machine')
          .append($('<option value=""></option>'))
          .append($('<option value="Master">Master</option>'))
          .append($('<option value="Slave">Slave</option>'));
        break;
      default:
        $('#store_machine')
          .append($('<option value="">Select Machine</option>'))
          .append($('<option value="Master">Master</option>'));
    }
  });
})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
  <td>
    <b>Store ID</b>
    <br>
  </td>
  <td>
    <input type="number" id="store_id" />
    <br>
  </td>
</tr>
<tr>
  <td>
    <b>Machine</b>
    <br>
  </td>
  <td>
    <select name="select-native-3" id="store_machine" data-iconpos="left">
            <option value="Master">Master</option> 
            <option value="Slave">Slave</option>
        </select>
    <br>
  </td>
</tr>

如何更改特定数据选择的下拉菜单

1 个答案: