Question

我在将文本字段隐藏/显示方面遇到问题。这是一个例子：

我想要的是文本字段仅在所选值等于1时显示，并为其他所有值隐藏。复选框部分工作正常。

从jsfiddle复制的代码：

<html>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<title>Test Page</title>
<body>
  <table id="testList">
    <tbody>
      <tr>
        <td><input type='checkbox'></td>

        <td><select>
   <option value="0">Volvo</option>
   <option value="1">Saab</option>
   <option value="2">Mercedes</option>
   <option value="3">Audi</option><input type='text' style="display: none">
            </select>
</td>
      </tr>
      <tr>

        <td><input type='checkbox'></td>
<td><select>
   <option value="0">Volvo</option>
   <option value="1">Saab</option>
   <option value="2">Mercedes</option>
   <option value="3">Audi</option>
 </select><input type='text' style="display: none">
      </td>
        </tr>
      <tr>
        <td><input type='checkbox'></td>
<td><select>
   <option value="0">Volvo</option>
   <option value="1">Saab</option>
   <option value="2">Mercedes</option>
   <option value="3">Audi</option>
    </select> <input type='text' style="display: none">
</td>
      </tr>
    </tbody>
  </table>
<script>
jQuery(function($) {


      $("select").change(function() {
        var $this = $(this),
            $checkbox = $this.parent().prev().find(":checkbox");

        if ($this.val() != 0) {
        $checkbox.attr("disabled", true);
            if($this.val() == 1){
            $(":text").show();
            }
            else{
                $(":text").hide();
            }    


        } else {
          $checkbox.removeAttr("disabled");
        }

          });

      $(":checkbox").change(function() {
        var $this = $(this),
            $select = $this.parent().next().find("select");

        if ($this.is(":checked")) {
          $select.attr("disabled", true);
        } else {
          $select.removeAttr("disabled");
        }
      });

    });
</script>    
</body>
</html>

Answer 1

http://jsfiddle.net/vsYB8/20/

而不是使用$(':text').show()，您需要$(this).siblings(':text').show()。

这将选择相应的文本框而不是所有文本框。

jquery显示/隐藏字段

1 个答案: