Home > Web Front-end > JS Tutorial > jQuery operates Select's Text and Value (get/set/add/delete)_jquery

jQuery operates Select's Text and Value (get/set/add/delete)_jquery

WBOY
Release: 2016-05-16 17:40:56
Original
1078 people have browsed it
jQuery gets the Text and Value selected by Select:
Select an item and try it
Syntax explanation:
Copy code The code is as follows:

. $("#select_id").change(function(){//code...}); //Add an event for Select, when selected Triggered when one of the items is
. var checkText=$("#select_id").find("option:selected").text(); //Get the Text selected by Select
. var checkValue=$(" #select_id").val(); //Get the Value of Select
. var checkIndex=$("#select_id ").get(0).selectedIndex; //Get the index value of Select
. var maxIndex=$("#select_id option:last").attr("index"); //Get the maximum index value of Select

jQuery sets the Text and Value of Select:
Syntax explanation:
Copy code The code is as follows:

. $( "#select_id ").get(0).selectedIndex=1; //Set the item with Select index value 1 to be selected
. $("#select_id ").val(4); //Set the Value of Select The item with a value of 4 is selected
. $("#select_id option[text='jQuery']").attr("selected", true); //Set the Text value of Select to be the item with jQuery selected

jQuery adds/removes the Option item of Select:
Click once and Select will append an Option
Click will insert an Option at the first position of Select
Click The Option (the last one) with the largest index value in Select will be deleted
Syntax explanation:
Copy code The code is as follows:

. $("#select_id").append(""); //Append an Option (drop-down item) to Select
. $("#select_id").prepend(""); //Insert an Option (first position) for Select
. $ ("#select_id option:last").remove(); //Delete the Option with the largest index value in Select (the last one)
. $("#select_id option[index='0']").remove() ; //Delete the Option (first) with index value 0 in Select
. $("#select_id option[value='3']").remove(); //Delete Value='3 in Select 'Option
. $("#select_id option[text='4']").remove(); //Remove the Option
of Text='4' in Select
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template