2

html code:

<select>
    <br>
    <option>1</option><br>
    <option>2</option><br>
</select>

This select will default display the first option item(display 1).
Now i want to change select to display the second item by jquery when dom is ready, but i tried several times, all failed.The following is my attempt:

  1. $('select').prop('selectIndex', 1);
  2. $('option').eq(1).attr('selected', 'selected');
  3. $('option').eq(1).prop('selected', true);
  4. default set select's style to 'display:none' in html code, then try above three ways and finally invoke $('select').show()

Maybe, i am only setting the dom value, not tell browser to refresh 'select'.

Do you konw the other way to refresh default display option in select?

Ionică Bizău
  • 109,027
  • 88
  • 289
  • 474
PorcoRosso
  • 33
  • 1
  • 4
  • The answer is on this post... [How tochange the selected option][1] [1]: http://stackoverflow.com/questions/7373058/how-to-change-the-selected-option-of-html-select-element – schieben Feb 07 '13 at 05:13
  • the answer is here... http://stackoverflow.com/questions/7373058/how-to-change-the-selected-option-of-html-select-element – schieben Feb 07 '13 at 05:15

3 Answers3

1

You have to add values to your options from select.

<select>
  <option value="1">First</option>
  <option value="2">Second</option>
</select>

Then, just set the value "2".

$("select").val("2");

Or, you can do this simply setting the second value from select.

$("select").val(2);

See the working example here.

Ionică Bizău
  • 109,027
  • 88
  • 289
  • 474
0

This is enough

$("select").val(2);
Ranganadh Paramkusam
  • 4,258
  • 2
  • 22
  • 33
0

i think you want to select option 2 when page is load.

<select>
    <option>1</option>
    <option selected="selected">2</option>
</select>
Devang Rathod
  • 6,650
  • 2
  • 23
  • 32