jquery Summary of common operations such as radio boxes, multiple marquee boxes, text boxes, etc.

Source: Internet
Author: User

  This article is mainly on the jquery to the radio box, multiple marquee, text boxes and other common operations are introduced, the need for friends can come to the reference, I hope to help you.

A, text box, radio button, check box, related operations     code are as follows: Var sex=$ ("Input[name= ' Sex ']:checked"). Val ();  //Get a set of radio selected values   var item=$ ("#sel option:selected"). Text ();      //Gets the text of the Select selected item   var option_num=$ (' #sel '). Val ();                //Get Select Item index   $ ("#sel") [0].selectedindex = 1;                  //select The second element of the dropdown box is the currently selected value   $ ("Input[name= ' Sex ')"). Get ( 1). Checked=true;    //radio The second element of the radio group is the currently selected value       or the default selection setting for the Radio box:  $ ("input[name= ' Sex ')"). each (function () {               if ($ (this). Val () ==s) {              &NB Sp   $ (this). attr ("Checked", true);                        &N Bsp        //this.checked=true;             }      &NB Sp  });     Jquery Set Drop-down list (select) by value values the default selection code is as follows:   <select Name=sel onchange= "Bao (this.options[ This.options.selectedindex].value) ">   <option value=" "> Please select   <option value=" 1 ">item 1   <option value= "2" >item 2   <option value= "3" >item 3   </select>   <script>   F Unction Bao (s)   {     txt.value=s;      //Select the first item to be selected so that there is a change.     &NB Sp;document.all.sel.options[0].selected=true; &NBSP}  </script>  <textarea id=txt></textarea>   II, jquery get Select selected text and value The code is as follows: Syntax explanation:  $ ("#select_id"). Change (function () {//code ...});  //Add event for Select, triggering  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") of the Select Selection. Get (0). SelectedIndex;  //Gets the index value selected by select  var maxindex=$ ("#select_iD option:last "). attr (" index ");  //Get Select the largest index value     jquery set the text and value of select selected: Syntax Explanation:  $ ("#select_id"). (0). selectedindex= 1;  //Set the Select index value of 1 to select  $ ("#select_id"). Val (4);  //Set the item with value of 4 for Select Select  $ ("#select_id option[text= ' jQuery ')"). attr ("selected", true);  //Set Select's text value to jquery entries check   jquery Add/Remove option for select: Syntax Explanation:  $ ("#select_id"). Append ("<option Value= ' Value ' >Text</option> ');  //appends an option (Drop-down)  $ ("#select_id") to the Select. Prepend ("<option value= ' 0 ' > Please select </option>");  //Inserts an option (first position)  $ ("#select_id option:last") for the Select. Remove ();  //deletes the maximum index value option (the last)  $ ("#select_id option[index= ' 0") of the Select. Remove ();  //Deletes the Option (first)  $ ("#select_id option[value= ' 3 ')" with index value 0 in the Select. Remove ();  //deletes Option  $ ("#select_id option[text= ' 4 ')" of value= ' 3 ' in the Select). Remove ();  //Delete option     application of text= ' 4 ' in select: The code is as follows: <! DOCTYPE html> <html> <head> <meta charset= "Utf-8" > <meta http-equiv= "x-ua-compatible" content= "ie=edge,chrome=1" > <title >jquery common</title> <meta name= "description" content= "" > <meta name= "keywords" content= "" > <link href= "" rel= "stylesheet" > <script type= "text/javascript" src= "Jquery-1.8.3.min.js" ></script > <script type= "text/javascript" >     $ (document). Ready (function () {       // Initialize Drop-down List--dynamic add         var item = [' Kindergarten ', ' primary ', ' Junior high ', ' High School ', ' university ', ' postgraduate ', ' PhD ', ' Master '];         var html = "<option value= ' 0 ' > Please select </option>";         for (var i = 0;i < item.length;i++) {            HTML = " Option value= ' "+ (i+1) +" ' > "+item[i]+" </option> ";        }         $ ("#grade"). Empty (). append (HTML);           $ ("#grade option[value= ' 0 ']"). attr ("Selected", "SelectEd ")//Default first item selected    })    /Add event for Select, triggering     function Showit () {    &NB Sp   var SelectText = $ ("#grade option:selected"). Text ()//Get Select selected text        //var SelectText = $ ("#grade"). Find ("option:selected"). Text ()//This method is also feasible         var selectvalue = $ ("#grade"). Val () ;//Get selected value         var selectindex = $ ("#grade"). Get (0). selectedindex//Gets the index value of select         var text = ' Select: ' +selecttext+ ' n ';         text + = ' value: ' +selectvalue+ ' n ';         text + = ' index value: ' +selectindex;         $ ("#text"). Text (text);    } </script> </head> <body>     <div>         <selec T name= ' grade ' id= ' grade ' onchange= ' showit () ' ></select>         <p><textarea name = ' text ' id= ' text ' row= ' col= ' ></textarea></p>     </div> </body> </html>  

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.