单击 Javascript 中的复选框时如何更改 check/uncheck 列表框

Question

我正在使用 div 和 css 的 ID 来选中和取消选中复选框，但我的来源无法按预期进行

第 1 步：默认复选框未选中且列表框已禁用

步骤 2：当我选中复选框时，列表框被启用

第 3 步：返回第 1 步，如果我取消选中复选框，列表框将被禁用

我的来源：

$('#parnerCheck2').click(function() {
  $('#partnerName').prop("checked", false).prop("disabled", true);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<tr>
  <th scope="row">Partner</th>
  <td colspan="1" style="margin-top: 4px;">
    <input id="parnerCheck2" name="parnerCheck" type="checkbox" value="0" /><span>PARTNER</span>
  </td>
  <td>
    <select id="partnerName" name="partnerName">
      <option value="" selected>Choose One</option>
      <option>01 - Elite</option>
    </select>
  </td>
</tr>

如何解决我描述的问题？非常感谢

Answer 1

你快到了。您可以在复选框的选中值的列表框上设置禁用属性，前缀为not运算符!以反转值，以获得您想要的结果。

$('#parnerCheck2').click(function() {
  $('#partnerName').prop("disabled", !$(this).prop("checked"));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<tr>
  <th scope="row">Partner</th>
  <td colspan="1" style="margin-top: 4px;">
    <input id="parnerCheck2" name="parnerCheck" type="checkbox" value="0" /><span>PARTNER</span>
  </td>
  <td>
    <select id="partnerName" name="partnerName" disabled>
      <option value="" selected>Choose One</option>
      <option>01 - Elite</option>
    </select>
  </td>
</tr>

Answer 2

这也行。

<body>
    <script>
        $(document).ready(function() {
        //set initial state.
        $('#partnerName').prop('disabled', true);

        $('#partnerCheck').click(function() {
            if ($('#partnerCheck').is(':checked')) {
                $('#partnerName').prop('disabled', false);
            }
        });
        });
    </script>
 
 
    <tr>
        <th scope="row">Partner</th>
        <td colspan="1" style="margin-top: 4px;">
            <input id="partnerCheck" name="partnerCheck" type="checkbox" value="0" /><span>PARTNER</span>
        </td>
        <td>
            <select id="partnerName" name="partnerName">
                <option value="" selected >Choose One</option>
                <option>01 - Elite</option>
            </select>
        </td>
    </tr>
</body>

单击 Javascript 中的复选框时如何更改 check/uncheck 列表框

How to change check/uncheck listbox when click checkbox in Javascript

html

javascript

css

ajax

jquery