码迷,mamicode.com
首页 > 其他好文 > 详细

如何获取select中的value、text、index相关值

时间:2017-06-10 22:39:39      阅读:237      评论:0      收藏:0      [点我收藏+]

标签:sel   model   获取   getattr   jquery   www   jquer   baidu   相关   

  select还是比较常用的一个标签,如何获取其中的内容呢? 

  如下所示:

<select id="select">
    <option value="A" url="http://www.baidu.com">第一个option</option>
    <option value="B" url="http://www.qq.com">第二个option</option>
</select>

  

一、js原生方法获取

  

1:拿到select对象: `var myselect=document.getElementById("select");

2:拿到选中项的索引:var index=myselect.selectedIndex ; // selectedIndex代表的是你所选中项的index

3:拿到选中项options的value: myselect.options[index].value;

4:拿到选中项options的text: myselect.options[index].text;

5:拿到选中项的其他值,比如这里的url: myselect.options[index].getAttribute(url);

 

 

二、jquery方法获取

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

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

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

4:alert(options.attr(url)); //拿到选中项的url值

 

 

 

三、vue方法

<select v-model="selected">
  <option disabled value="">Please select one</option>
  <option>A</option>
  <option>B</option>
  <option>C</option>
</select>
<span>Selected: {{ selected }}</span>

 

如何获取select中的value、text、index相关值

标签:sel   model   获取   getattr   jquery   www   jquer   baidu   相关   

原文地址:http://www.cnblogs.com/zhuzhenwei918/p/6980088.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!