jquery Gets the value of option and operates on option

Source: Internet
Author: User

  This article describes the value of jquery for option and the operation of option, below are good example analysis and sample code, interested friends can understand the following

jquery Gets the Select element and selects the text and value:      code as follows: $ ("#select_id"). Change (function () {//code ...}); Adds an event for a select that triggers   var checktext=$ ("#select_id") when one of the items is selected. Find ("option:selected"). Text (); Gets the text  var checkvalue=$ ("#select_id") selected by select. Val (); Gets the value  var checkindex=$ ("#select_id") selected by Select. Get (0). SelectedIndex; Gets the index value   var maxindex=$ ("#select_id option:last") selected by select. attr ("index"); Get select the largest index value     jquery Gets the Select element and sets the text and value:    instance parsing:  code as follows: $ ("#select_id"). Get (0) . selectedindex=1; Sets the item with the Select index value of 1 to check   $ ("#select_id"). Val (4); The item with the value value of 4 set for select   $ ("#select_id option[text= ' jQuery ')"). attr ("selected", true); Set Select's text value to jquery's item check     jquery Add/Remove option for SELECT element:    Instance Analysis:    code as follows: $ ("# select_id "). Append (" <option value= ' value ' >Text</option> "); Appends an option (dropdown)   $ ("#select_id") to the Select. Prepend ("<option value= ' 0 ' > Please choose </option>"); Inserts a opti for the SelectOn (first position)   $ ("#select_id option:last"). Remove (); Deletes the maximum index value option (last)   $ ("#select_id option[index= ' 0") in Select. Remove (); Deletes option (first)   $ ("#select_id option[value= ' 3 ']" with index value of 0 in Select. Remove (); Deletes the option  $ ("#select_id option[text= ' 4 ')" of value= ' 3 ' in the Select). Remove (); Deletes the option    level <select of text= ' 4 ' in the Select Name= "Thirdlevel" id= "Thirdlevel"   onchange= " Getfourthlevel () ">  <option value=" 0 "id=" thirdoption ">  Please select class three   </option>  < /select>  </div>    Class four:  <select name= "Fourthlevelid" id= "Fourthlevelid" >  <option value= "0" id= "fourthoption" >  Please select Class four   </option>  </select>  </div >  if ($ ("#thirdLevel"). Val ()!=0) {  $ ("#thirdLevel option[value!=0]"). Remove (); }  if ($ ("# Fourthlevelid "). Val ()!=0) {  $ (" #fourthLevelId option[value!=0] "). Remove (); }// This says: If we want to choose the third class when we choose: if there is data in class fourth, delete it, if there is no data in category fourth, the default value is in the product. In the PostAfter learning the Ajax technology is often used to!     Get Select:  Get Select the text:  $ ("#ddlRegType"). Find ("option:selected"). Text ();  Gets the value:    $ ("#ddlRegType") selected by select. Val ();    Get Select Selected index:  $ ("#ddlRegType"). Getting (0). selectedindex;  Set select:  Set the Select Selected index:  $ ("#ddlRegType"). Get (0). Selectedindex=index;//index to index value     Set the value:  code for select selected as follows: $ ("#ddlRegType"). attr ("value", "Normal");  $ ("#ddlRegType"). Val (" Normal ");  $ (" #ddlRegType "). Get (0). Value = value;    Set Select text:    code as follows: 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 the Select option item:    Code as follows: $ ("#select _id "). Append (" <option value= ' value ' >text</Option> "); Add a option  $ ("#select_id"). Prepend ("<option value= ' 0 ' > Please select </option>"); Insert a previous item option  $ ("#select_id option:last"). Remove (); Deletes the maximum index value of option  $ ("#select_id option[index= ' 0 ')"). Remove ()//delete option  $ ("#select_id option[with index value 0 Value= ' 3] "). Remove (); Delete option  $ ("#select_id option[text= ' 4 ')" with a value of 3. Remove (); Delete option    empty select:    $ ("#ddlRegType") with the text value of 4. Empty ();    jquery get value:    Val ()   text ()     Set value   val (' Set value here ') the     code is as follows: $ ("document"). Ready (function () {  $ ("# Btn1 "). Click (function () {  $ (" [name= ' checkbox '] "). attr (" Checked ", ' true ');//select  })   $ (" #btn2 "). Click (function () {  $ ("[name= ' checkbox ']"). Removeattr ("checked");//deselect All  })   $ ("#btn3"). Click (Function () {  $ ("[name= ' checkbox ']:even"). attr ("Checked", ' true ');//Select All Odd  })   $ ("#btn4"). Click (function () {  $ ("[name= ' checkbox ']"). each (function () {//anti-election   if ($ (this). attr ("checked")) {  $ (this). Removeattr ("checked"); }  $ (this). else{  ("attr", "true");  } })  })   $ ("#btn5"). Click (function () {//Output selected value   var str= "";  $ ("[name= ' checkbox '] [ Checked] ""). each (function () {  str+=$ (This). Val () + "RN"; //alert ($ (this). Val ()); })   Alert (str) ; })  })    

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.