jquery及原生js获取select下拉框选中的值示例,select中钦点option选中触发事件

By admin in 4858美高梅 on 2019年3月25日

一:JavaScript原生的措施

近年来有一id=test的下拉框,怎么得到当选的格外值吗?

对于以下select标签,获取当前增选的值得格局如下:

贯彻 select中钦定option选中触发事件

我们在选取下拉列表框select时,必要对中选的<option>选项触发事件,其实<option>本人并未接触事件措施,大家唯有在select里的onchange方法里接触。

想添加八个option的接触事件,在option中添加onclick
点来点去正是不会接触事件

又在select中添加onclick 那下可好了,没选option呢就接触了

百度来的说option没有接触事件,须要在select中加onchange事件,尽管小编已经处理过类似的题材,用过就忘是还是不是猪脑子….

这一次记住了呢应该

当大家触发select的双击事件时,用ondblclick方法。
当大家要收获select的入选事件时,用document.all[‘name’].value来获取,其中name是select的名称。
假如大家要得到select的全方位的值就用3个for循环来完成。代码如下:
var vi = document.all[‘list’].length;
for(var i=0;i<vi;i++){
document.form2.list(i).value; //form2是<form>的名称
}

4858美高梅 1

‍‍<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>

4858美高梅 2

 

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获得select下拉框选中的的值

现行反革命有一id=test的下拉框,怎么得到当选的相当值吗?

分别选拔javascript原生的格局和jquery方法

<select id=”test”  name=””>   
4858美高梅 ,jquery及原生js获取select下拉框选中的值示例,select中钦点option选中触发事件。  <option   value=”1″>text1</option>   
  <option   value=”2″>text2</option>   
 </select>

code:

一:javascript原生的法子

  1:拿到select对象: var  myselect=document.getElementById(“test”);

  2:得到当选项的目录:var index=myselect.selectedIndex ;             //
selectedIndex代表的是您所选中项的index

  3:得到当选项options的value:  myselect.options[index].value;

  4:得到当选项options的text:  myselect.options[index].text;

二:jquery方法(前提是早已加载了jquery库)

1:var options=$(“#test option:selected”);  //获取选中的项

2:alert(options.val());   //得到当选项的值

3:alert(options.text());   //得到当选项的公文

 

转载:

 

1:拿到select对象: var myselect=document.getElementById(“test”);

分级采取javascript原生的法子和jquery方法

<select id="test" name="">
<option value="1">text1</option>
<option value="2">text2</option>
</select>

2:得到当选项的目录:var index=myselect.selectedIndex ; //
selectedIndex代表的是您所选中项的index

复制代码 代码如下:

code:
一:javascript原生的不二法门
1:拿到select对象: var myselect=document.getElementById(“test”);
2:获得当选项的目录:var index=myselect.selectedIndex ; //
selectedIndex代表的是你所选中项的index
3:获得当选项options的value: myselect.options[index].value;
4:拿到当选项options的text: myselect.options[index].text;
二:jquery方法(前提是早已加载了jquery库)

3:得到当选项options的value: myselect.options[index].value;

<select id=”test” name=””>
<option value=”1″>text1</option>
<option value=”2″>text2</option>
</select>

1:var options=$(“#test option:selected”); //获取选中的项

4:获得当选项options的text: myselect.options[index].text;

一:javascript原生的章程

2:alert(options.val()); //拿到当选项的值

二:jQuery主意(前提是早就加载了jquery库)

1:拿到select对象: var myselect=document.getElementById(“test”);

3:alert(options.text()); //拿到当选项的文件

1:var options=$(“#test option:selected”); //获取选中的项

2:得到当选项的目录:var index=myselect.selectedIndex ; //
selectedIndex代表的是您所选中项的index

2:alert(options.val()); //得到当选项的值

3:得到当选项options的value: myselect.options[index].value;

3:alert(options.text()); //获得当选项的文书

4:得到当选项options的text: myselect.options[index].text;

二:jquery方法(前提是已经加载了jquery库)

1:var options=$(“#test option:selected”); //获取选中的项

2:alert(options.val()); //得到当选项的值

3:alert(options.text()); //获得当选项的文本

分别采取javascript原生的不二法门和jquery方法 复制代码 代码如下: select
id=”test” name=”” optio…

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图
Copyright @ 2010-2019 美高梅手机版4858 版权所有