Question

在下面，我使用filter（'input：text，textarea'）将输入字段设置为只读（并使它们不透明）。但是，此选择器仅选择文本输入，而不选择textarea。我做错了什么？

<!DOCTYPE html>
<html>
  <head>
    <title>setReadOnly() Test</title>
    <link rel="stylesheet" type="text/css" href="../styles/core.css">
    <link rel="stylesheet" type="text/css" href="test.setReadOnly.css">
    <script type="text/javascript" src="../scripts/jquery-1.4.js"></script>
    <script type="text/javascript" src="../scripts/jqia2.support.js"></script>
    <script type="text/javascript">
        (function($){
          $.fn.setReadOnly = function(readonly) {
            return this.filter('input:text,textarea')
              .attr('readOnly',readonly)
              .css('opacity', readonly ? 0.5 : 1.0)
              .end();
          };
        })(jQuery);
    </script>
    <script type="text/javascript">
      $(function(){
        $('#sameAddressControl').click(function(){
          var same = this.checked;
          $('#billAddress').val(same ? $('#shipAddress').val():'');
          $('#billCity').val(same ? $('#shipCity').val():'');
          $('#billState').val(same ? $('#shipState').val():'');
          $('#billZip').val(same ? $('#shipZip').val():'');
          $('#bill_random_field').val(same ? $('#ship_random_field').val():'');
          $('#billingAddress input').setReadOnly(same);
        });
      });
    </script>
  </head>

  <body>

    <div data-module="Test setReadOnly()">

      <form name="testForm">
        <div>
          <label>First name:</label>
          <input type="text" name="firstName" id="firstName"/>
        </div>
        <div>
          <label>Last name:</label>
          <input type="text" name="lastName" id="lastName"/>
        </div>
        <div id="shippingAddress">
          <h2>Shipping address</h2>
          <div>
            <label>Street address:</label>
            <input type="text" name="shipAddress" id="shipAddress"/>
          </div>
          <div>
            <label>City, state, zip, random_field:</label>
            <input type="text" name="shipCity" id="shipCity"/>
            <input type="text" name="shipState" id="shipState"/>
            <input type="text" name="shipZip" id="shipZip"/>
            <textarea name="random_field" rows="2" cols="20" id="ship_random_field"></textarea>
          </div>
        </div>
        <div id="billingAddress">
          <h2>Billing address</h2>
          <div>
            <input type="checkbox" id="sameAddressControl"/>
            Billing address is same as shipping address
          </div>
          <div>
            <label>Street address:</label>
            <input type="text" name="billAddress"
                   id="billAddress"/>
          </div>
          <div>
            <label>City, state, zip, random_field:</label>
            <input type="text" name="billCity" id="billCity"/>
            <input type="text" name="billState" id="billState"/>
            <input type="text" name="billZip" id="billZip"/>
            <textarea name="random_field" rows="2" cols="20" id="bill_random_field"></textarea>
          </div>
        </div>
      </form>
    </div>

  </body>
</html>

Answer 1

尝试将行$('#billingAddress input').setReadOnly(same);更改为$('#billingAddress input,textarea').setReadOnly(same);

<强>更新

实际上，必须像您在评论中所说的那样：$('#billingAddress input,#billingAddress textarea')。

为什么这个jquery选择器不选择textarea？

1 个答案: