A summary of some basic methods of jquery operation Select

Source: Internet
Author: User

T1 >>> Create a new Select
var $newSelect = $ ("<select id=\" sel\ "name=\" s_name\ "></select>"); Note Escape \


T2 >>> Create a new option
var $option = $ ("<option value=\" value\ ">1</option>");


T3 >>> add option to array options
Way One:
$newSelect. Append ($option);
Way two:
$newSelect. Append ("<option value=\" value\ ">1</option>"); Add to option sequence last
Way three:
$newSelect. Prepend ("<option value=\" value\ ">1</option>"); Add to Option sequence top
Option index value overflow is not supported add new option

T4 >>> Adding a Select to a page
$newSelect. AppendTo (' body ');
$newSelect. AppendTo ($ (' body '));
$ (' body '). Append ($newSelect);

The Append () and AppendTo () methods perform the same tasks.
The difference is that the location of content and selectors, and append () can use functions to attach content.
$ (selector). Append (function (index,html))


T5 >>> Clear option options for select
$ ("#sel option[value= ' 1 ']"). Remove (); Remove option with value 1
$ ("#sel option[index=2]"). Remove (); To remove option with index 2
$ ("#sel option[text= ' _txt ')". Remove (); Remove the option with the text value of _txt
$ ("#sel option:last"). Remove (); Remove the last option
$ ("#sel option:selected"). Remove (); Remove selected selected option

T6 >>> Modify option option for select

The text value of the selected item
Newselect.find (' option:selected '). Text ();

Value of the selected item
$newSelect. Val ()
$newSelect. Find (' option:selected '). Val ();
$ (' select[name= ' S_name "]). Find (' option:selected '). Val ();

The text val value of any item
$newSelect. Find (' option '). EQ (index). text ();
$newSelect. Find (' option '). EQ (Index). Val ();

$newSelect. Children (' option '). EQ (index). text ();
$newSelect. Children (' option '). EQ (Index). Val ();

$ ("#sel option[value= ' 1 ']"). Text ();
$ ("#sel option[value= ' 1 ']"). Val ();

$ ("#sel option[index=2]"). Text ();
$ ("#sel option[index=2]"). Val ();

$ ("#sel option[text= ' _txt ')". text ();
$ ("#sel option[text= ' _txt ')". Val ();

Outputs all text values for the option sequence.
$newSelect. Text ()

Output Select the index value that is selected.
$ ("#sel"). Get (0). SelectedIndex; Get (0) converts the jquery object into the Dom form.
$ ("#sel option:selected"). Index ()

Gets the length value of option
$ ("#sel option"). length
$newSelect. Find (' option '). length
$newSelect. Children (' option '). length


>>> the entire process
<script>
var $newSelect = $ ("<select id=\" sel\ "></select>");
var $option = $ ("<option value=\" 1\ ">1</option>");
$ (' body '). Append ($newSelect);
$newSelect. Append ($option);
</script>


Note: Some of the ways to convert jquery and DOM elements are sometimes used:
$ (this) [0]
$ (this). Get (0)
$ (this). ToArray () [0];
The above 3 types of notation are equivalent

A summary of some basic methods of jquery operation Select

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.