jquery selection if option.value equal something, mark a selected
I have some question about jquery selection. In my case, how to match if the option.value
equal something, mark a selected
for it. Online code here
repeat code again. It caused Uncaught TypeError: Object #<HTMLOptionElement> has no method 'val'
, how to work as my hope? Thanks.
<script type="text/javascript">
$(document).ready(function(){
var num = 3;
$("div#selection select.select option").each(function(){
if((this).val()==num){
$(this).attr("selected","selected");
}
});
});
</script>
<div id="selection">
<label>Label1:</label>
<select class="select">
<option value="1">V1</option>
<option value="2">V2</option>
<option value="3">V3</option>
</select>
<label>Label2:</label>
<select class="select">
<option value="4">U1</option>
<option value="5">U2</option>
<option value="6">U3</option>
</select>
</div>
You made a typo
Instead of (this).val()
you should use $(this).val()
in your if statement. this
refers to a HTMLObject, $(this)
would refer to a jQuery object. Because the .val()
method is part of the jQuery framework, you can't use it on HTMLObjects. But I'm sure you knew that because it looks very much like a small typo.
This should work:
$(document).ready(function(){
var num = 3;
$("div#selection select.select option").each(function(){
if($(this).val()==num){ // EDITED THIS LINE
$(this).attr("selected","selected");
}
});
});
Edit
You could optimize your loop by adding a return false;
( break;
for vanilla loops) when you have found your element so it doesn't keep looping elements while we're already "done".
However, you should look at Nicola Peluchetti's answer for a more efficient and cleaner code.
You have a typo and to set the option as selected you should use prop()
and not attr(). in any case you could do
var num = 3;
$("div#selection select.select option[value="+num+"]").prop("selected", true);
fiddle here http://jsfiddle.net/YRBrp/
EDIT - the typo of course is what Tim S. pointed out, you should use $(this).val()
and not (this).val()
Your problem starts here
$("div#selection select.select option ").each(function(){ if( (this).val() ==num){
change it to
$("div#selection select.select").each(function(){
if($(this).val()==num){
and all your problem solved. You might want to change the .each to .change if you are thinking of having the script triggered everytime the selection is changed.
链接地址: http://www.djcxy.com/p/83070.html