Summary of various methods for jquery to obtain select values

In the past, it was a little difficult to use js to obtain the selected value. Now it is much easier to use jquery operations, next I will introduce jquery's various methods for obtaining select values. For more information, see.

Obtain the text of the selected select item.

Var item = $ ("select [@ name = items] option [@ selected]"). text ();

The second element in the select drop-down box is the selected value.

$ ('# Select_id') [0]. selectedIndex = 1;

Value

JQuery ("# select1"). val (); is to get the selected value,

Example

The Code is as follows:	Copy code
<Select multiple = "multiple" id = "select1" size = "5" name = "dd"> <Optgroup label = "potholes"> <Option value = "1" disabled = "disabled"> let's go! </Option> <Option value = "2"> ah! </Option> </Optgroup> <Option value = "3"> http://www.bKjia. c0m ah! </Option> <Option id = "si" selected = "selected" value = "4"> Winter Melon! </Option> <Option value = "5"> let me go! </Option> </Select>

Let's talk about this label http://www.bKjia. c0m!
(1) The multiple attribute can be selected multiple times! It is written as follows: multiple = "multiple"
(2) size = "3", that is, the select tag can have at most three options.
(3) disabled = "disabled": This attribute is disabled! It cannot be used!
(4) seleted = "selected" in option indicates that this option is displayed in the drop-down box during initialization! To put it bluntly, it is selected by default!
The optgroup label is classified in the option to facilitate selection. But this is not an option!
Disable disabled = "disabled" means to disable this option, that is, you can only watch but cannot choose. Very pitfall!
The ⑺ value attribute is "value", which is useless. It is "value" when transmitted to the server.

Haha! It's useless to write so much. Next I will write Jquery!
(1) $ ("# select1"). find ("option: selected"). text ()
This means to select the <select> tag, then find the tag with the selected attribute in the option tag, and finally obtain the text content of the tag. In this article, we will get: "winter melon! "
(2) $ ("# select1"). val ()
This is to get the value mentioned above, but note that if all options have the default value selected attribute, the result of this Code is the value of this option. If neither option has the selected attribute, the value of the first option is displayed. If no value is set, the text () content is displayed.
In the text: the result is "4". If the value = "4" in this line is removed, "winter melon!" is displayed !"
(3) $ ("# si"). attr ("value", "donggua ");
$ ("# Si"). val ("donggua ");
$ ("# Si"). get (0). value = "donggua ";
This will not be explained! Assign a value to option!
(4) $ ("# select1"). get (0). options [3]. value
Get (0) gets the select DOM object and operates on it. This operation is performed on its value. You can change the value to text to operate on its text! You can also replace selected, but the returned values are false or true.
Else $ ("# select1 option [text = 'fool! '] "). Attr (" selected ", true)
Set the selected attribute.
Else $ ("# select1"). append ("<option value = '8' selected = 'selected'> donggua </option> ");
Append all knows that it is the content appended to the element. Here I add a row of options.
Parameters $ ("# select1"). prepend ("<option value = '9'> select </option> ");
Prepend is the default meaning. Here we also add a row of options. The difference is that. Prepend is added in the first position of select, while append is added in the last position.
Else $ ("# select1 option: last"). remove (); // Delete the last row
$ ("# Select1 option [value = '4']"). remove (); // Delete the fourth row
$ ("# San"). remove (); // Delete the third row;
$ ("# Select1"). empty (); // delete all options

Others

Obtain the selected text in the select statement:
$ ("# Ddlregtype"). find ("option: selected"). text ();

Obtain the value selected by the select statement:
$ ("# Ddlregtype"). val ();

Obtain the index selected by the select statement:
$ ("# Ddlregtype"). get (0). selectedindex;

Set select:
Set the index selected by select:
$ ("# Ddlregtype"). get (0). selectedindex = index; // index indicates the index value.

Set the value selected by select:

The Code is as follows:	Copy code
$ ("# Ddlregtype"). attr ("value", "normal"); $ ("# Ddlregtype"). val ("normal "); $ ("# Ddlregtype"). get (0). value = value;

Set select selected text:

The Code is as follows:	Copy code
Var count = $ ("# ddlregtype option"). length; For (var I = 0; I <count; I ++) {If ($ ("# ddlregtype"). get (0). options [I]. text = text) { $ ("# Ddlregtype"). get (0). options [I]. selected = true; Break; } } $ ("# Select_id option [text = 'jquery ']"). attr ("selected", true );

Set select option items:

The Code is as follows:

Copy code

$ ("# Select_id"). append ("<option value = 'value'> text http://www.bKjia. c0m </option>"); // Add an option $ ("# Select_id"). prepend ("<option value = '0'> select </option>"); // insert an option $ ("# Select_id option: last"). remove (); // Delete the option with the largest index value $ ("# Select_id option [index = '0']"). remove (); // delete an option with an index value of 0 $ ("# Select_id option [value = '3']"). remove (); // delete an option with a value of 3 $ ("# Select_id option [text = '4']"). remove (); // delete an option with a text value of 4

Clear select:

The Code is as follows:	Copy code
$ ("# Ddlregtype"). empty ();