Changing all the input field to blue
Question
My Jquery code is supposed to transform all the input fields of the form borders to blue .. but it doesn't do that ... Where did I exactly go wrong ?
<html>
<head>
<title>Form</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
alert('Works !');
$('#provision:text').css('border', '2px solid blue');
});
</script>
</head>
<body>
<form id="provision">ESNList:
<input type="text" id="ESNList" name="ESNList" size="30" />
<br />ESN Start:
<input type="text" id="ESNStart" name="ESNStart" size="10" />
<br />ESN End:
<input type="text" id="ESNStart" name="ESNStart" size="10" />
<br />UnitName:
<input type="text" id="STxName" name="STxName" size="30" />
<br />Unit Model:
<select name="STxName">
<option value="stx2">STX2</option>
<option value="protopak">Protopak</option>
<option value="stm3" selected>STM3</option>
<option value="acutec">Acutec</option>
<option value="mmt">MMT</option>
<option value="smartone">Trackpack</option>
<option value="smartoneb">SmartOneB</option>
<option value="audi">Acutec</option>
</select>
<br />RTU Model Type:
<select name="rtumodel">
<option value="globalstar">GlobalStar</option>
<option value="both">Both</option>
<option value="comtech">Comtech</option>
<option value="stmcomtech">STMComtech</option>
</select>
<br />
<input type="submit" value="submit" />
</form>
</body>
</html>
6 answers
solution1
4 2013-01-15 18:51:37
您需要实际查询那些<input>节点：
$('#provision input:text').css('border','2px solid blue');});
solution2
1 2013-01-15 18:54:59
You just need a space in your selector:
#provision :text
As written, it requires the #provision element itself to be a text input, rather than searching for a descendant of #provision . Spaces are significant in selectors!
However, you should note that :text is a jQuery extension , and therefore not as fast as a native selector.
A better selector therefore would be:
$('#provision input[type="text"]')
or, to ensure that you catch nodes without an explicit text type (but which default to text ):
$('#provision input').filter(':text')
solution3
0 2013-01-15 18:52:29
$('#provision input:text').css('border', '2px solid blue');
solution4
0 2013-01-15 18:54:29
This Should work -- see it working http://jsfiddle.net/LumF3/
<script type="text/javascript">
$(function () {
alert('Works !');
$('#provision input:text').css('border', '2px solid blue');
});
</script>
solution5
0 ACCPTED 2013-01-15 19:06:05
Here's the correct JQuery text-selector in your case:
$('#provision input:text').css('border', '2px solid blue');
The official API doc to the text-selector: http://api.jquery.com/text-selector/
solution6
-1 2013-01-15 18:51:47
Try $('#provision input') instead. You're trying to apply the border styles to text nodes inside the #provisions element.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.