Implement the specified option in select to select the trigger event
Implement the specified option in select to select the trigger event
When we use the drop-down list box select, we need to trigger an event for the selected <option> option. In fact, <option> itself does not trigger an event method, we only trigger it in the onchange method in the select.
If you want to add a trigger event of an option, add onclick to the option and click it, it will not trigger the event
Add onclick to select
Baidu came to say that option did not trigger an event, and you need to add an onchange event to the select, although I have dealt with similar problems before, and I forgot whether it was a pig's brain....
Remember this time
When we trigger the double-click event of the select, use the ondblclick method.
When we want to get the selected event of the select, use document.all['name'].value to get it, where name is the name of the select.
If we want to get all the values of select use a for loop to achieve. The code is as follows:
var vi = document.all['list'].length;
for(var i=0;i<vi;i++){
document.form2.list(i).value; //form2 is of <form> name
}
<select id="pid" onchange="gradeChange()">
<option grade="1" value="a">选项一</a>
<option grade="2" value="b">选项二</a>
</select>
<script type="text/JavaScript">
function gradeChange(){
var objS = document.getElementById("pid");
var grade = objS.options[objS.selectedIndex].grade;
alert(grade);
}
</script>
|
1
2
3
4
5
6
7
8
9
10
|
<
select
name="myselect" id="myselect">
<
option
value="opt1">选项1</
option
>
<
option
value="opt2">选项2</
option
>
<
option
value="opt3">选项3</
option
>
</
select
>
$("#myselect").change(function(){
var opt=$("#myselect").val();
...
});
|
Javascript get the selected value of the select drop-down box
Now there is a drop-down box with id=test, how to get the selected value?
Use javascript native methods and jquery methods respectively
<select id="test" name="">
<option value="1">text1</option>
<option value="2">text2</option>
</select>
code:
One: javascript native method
1: Get the select object: var myselect=document.getElementById("test");
2: Get the index of the selected item: var index=myselect.selectedIndex; // selectedIndex represents the index of your selected item
3: Get the value of the selected options options: myselect.options[index].value;
4: Get the text of the selected options: myselect.options[index].text;
Two: jquery method (provided that the jquery library has been loaded)
1:var options=$("#test option:selected"); //Get the selected item
2:alert(options.val()); //Get the value of the selected item
3:alert(options.text()); //Get the text of the selected item