今天别人问我一个问题

<body>
<select id="tests" onchange="test()">
<option >1</option> <option >2</option>
</select>
<div id="a" style="display: none">123</div>
<div id="b" style="display: ">456</div>
<script type="text/javascript">
function test(){
document.getElementById("a").style.display="";
document.getElementById("b").style.display="none";
}
</script>
</body>

要通过选择不同的下拉,显示不同的div。后来我给他改善了下

<html>
<body>
<select id="tests" onchange="test(this.value)">
<option value="a">1</option> <option value="b" selected>2</option>
<select>
<div id="a" style="display: none">123</div>
<div id="b" style="display: ">456</div>
<script type="text/javascript">
function test(val){
var divList = document.getElementsByTagName('div');
for(i=0;i<divList.length;i++){
if(divList[i].id==val){
divList[i].style.display='block';
}
else{
divList[i].style.display='none';
}
}
}
</script>
</body>
</html>

想了良久才想出来上面的方法

開始总是纠结在option取值上,如今趁这个机会梳理一下

<select id="tests" onchange="test(this.value)">
<option value="a">1</option>
<option value="b" selected>2</option>
<select>

先说传值吧,this.value就是选中的那个值,相应上面的语句就是  a,b

var obj=document.getElementById("view");

var selectObj = obj.options[obj.selectedIndex];//获取选中的那个对象

var val = selectObj.text;//获取选中的值   1,2

var trueVal = selectObj.value;//内部值  a,b

假设是jquery 就简单一点了

var txt=$("#test").find("option:selected").text();//1
2

var val=$("#test").find("option:selected").val();//
a  b



select的种种取值的更多相关文章

  1. 浅谈jquery关于select框的取值和赋值

    浅谈jquery关于select框的取值和赋值   jQuery("#select_id").change(function(){}); // 1.为Select添加事件,当选择其 ...

  2. jquery操作select(选中,取值)

    最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如<select class="selector"></ ...

  3. jQuery操作select控件取值和设值

    1.级联select的操作,后一个select的值随着前一个select选中值变化 $(".select_A").change(function(){ $(".selec ...

  4. jquery关于select框的取值和赋值

    jQuery("#select_id").change(function(){}); // 1.为Select添加事件,当选择其中一项时触发      var checkValue ...

  5. jquery操作select(option)的取值,设置和选中

    比如 <select class="selector"> <option value ="volvo">Volvo</option ...

  6. DataTable select根据条件取值

    1.封装独立方法 // 执行DataTable中的查询返回新的DataTable /// </summary> /// <param name="dt">源 ...

  7. easyui 》 radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  8. jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...

  9. select取值问题

    全栈攻城狮们给挖了各种坑..其中一个典型是select控件取值.直接上代码: <!DOCTYPE html> <html lang="en"> <he ...

随机推荐

  1. 关于int.TryParse的使用

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  2. python学习(2)

    编码: 需要注意的是:python 没有字符的概念,但是比如a='abcd',当中字母a占用一个字节,通过 方法len我们可以求出这个字符变量a所有字符个数,如:print len(a)显示结果为:4 ...

  3. chapter3习题

    // 2013年11月4日21:47:21 # include <stdio.h> # include <math.h> int main() { int n; double ...

  4. CentOS 6 用SVN自动提交文件到web服务器

    关于 svn 的安装 参考:[转]Linux(centOS6.5)下SVN的安装.配置及开机启动 经过两天的各种尝试总算解决了,总结如下: 1.在建立库时注意 要让库的名称和  要同步的 web目录名 ...

  5. svn笔记2

    Examining History Your Subversion repository is like a time machine. It keeps a record of every chan ...

  6. 深入浅出Win32多线程设计之MFC的多线程-线程与消息队列(经典)

    1.创建和终止线程 在MFC程序中创建一个线程,宜调用AfxBeginThread函数.该函数因参数不同而具有两种重载版本,分别对应工作者线程和用户接口(UI)线程. 工作者线程 CWinThread ...

  7. Linux fstab 参数详解

    [root@qs-wg-db1 /]# cat /etc/fstab LABEL=/          /                       ext3    defaults         ...

  8. python-Day3-set 集合-counter计数器-默认字典(defaultdict) -可命名元组(namedtuple)-有序字典(orderedDict)-双向队列(deque)--Queue单项队列--深浅拷贝---函数参数

    上节内容回顾:C语言为什么比起他语言块,因为C 会把代码变异成机器码Pyhton 的 .pyc文件是什么python 把.py文件编译成的.pyc文件是Python的字节码, 字符串本质是 字符数组, ...

  9. Qt调用DLL

    声明: 事先我已经自己动手写了一个简单的dll文件(myDLL.dll),C版接口的.并且用我前两篇有关DLL文章里面的方法,从dll中导出了导入库(.lib)文件,dll中有两个函数,原型如下:   ...

  10. libvirt命令行文档

    Libvirt有两种控制方式,命令行和图形界面 图形界面: 通过执行名virt-manager,启动libvirt的图形界面,在图形界面下可以一步一步的创建虚拟机,管理虚拟机,还可以直接控制虚拟机的桌 ...