使用jquery在基于用户定义的变量的select中选择一个选项

Question

Given a user-defined variable jstatus , I want that that particular variable should be selected in a given list of options.

My list is like this:

<select name='job_status' id='job_status'>
    <option>Pre-press</option>
    <option>Printers</option>
    <option>Cutting</option>
    <option>Final touches</option>
    <option>Delivery</option>
    <option>Ready</option>
</select>

And somewhere in my javascript code after setting the value of jstatus , this is my jquery:

$("#job_status option[value='"+jstatus+"']").attr('selected','selected');

But it's not working. What's the right way to do it?

Answer 1

最简单的方法是直接设置值：

jQuery("#job_status").val(jstatus);

Answer 2

您需要先向选择器添加值。

<option value="Pre-press">Pre-press</option>

Answer 3

The problem is that your select list has no "value"-property on its options

<select name='job_status' id='job_status'>
     <option value="val1">Pre-press</option>
     <option value="val2">Printers</option>
     <option value="val3">Cutting</option>
     <option value="val4">Final touches</option>
     <option value="val5">Delivery</option>
     <option value="val6">Ready</option>
</select>

<script>
    $( 'select option[value="val3"]' ).attr( 'selected', 'selected' );
</script>

You can also use jQuery's val() method

$( 'select' ).val( 'val3' )

this would have the same effect as the above

Answer 4

If you still prefer using a direct selector, there's :contains for you to select element by its contents. For your case it goes pretty much like this:

$("#job_status option:contains("+jstatus+")").attr('selected','selected');