为什么这个jquery选择器不选择textarea？
在下面，我使用 filter('input:text,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>
in the following, I am using filter('input:text,textarea') to set input fields as read only, (and make them opaque). However, this selector is selecting only the text inputs, and not the textarea. What am I doing wrong?
<!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>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
尝试将行
$('#billingAddress input').setReadOnly(same);更改为$('#billingAddress input,textarea').setReadOnly(same);更新
实际上，必须像您在评论中所说的那样：
$('#billingAddress input,#billingAddress textarea')。Try to change the line
$('#billingAddress input').setReadOnly(same);to$('#billingAddress input,textarea').setReadOnly(same);Update
Actually, must be like you said in the comment:
$('#billingAddress input,#billingAddress textarea').