select的种种取值
今天别人问我一个问题
<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的种种取值的更多相关文章
- 浅谈jquery关于select框的取值和赋值
浅谈jquery关于select框的取值和赋值 jQuery("#select_id").change(function(){}); // 1.为Select添加事件,当选择其 ...
- jquery操作select(选中，取值)
最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如<select class="selector"></ ...
- jQuery操作select控件取值和设值
1.级联select的操作,后一个select的值随着前一个select选中值变化 $(".select_A").change(function(){ $(".selec ...
- jquery关于select框的取值和赋值
jQuery("#select_id").change(function(){}); // 1.为Select添加事件,当选择其中一项时触发 var checkValue ...
- jquery操作select(option)的取值,设置和选中
比如 <select class="selector"> <option value ="volvo">Volvo</option ...
- DataTable select根据条件取值
1.封装独立方法 // 执行DataTable中的查询返回新的DataTable /// </summary> /// <param name="dt">源 ...
- easyui 》 radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中
获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...
- jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中
jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...
- select取值问题
全栈攻城狮们给挖了各种坑..其中一个典型是select控件取值.直接上代码: <!DOCTYPE html> <html lang="en"> <he ...
随机推荐
- BestCoder Round #50 (div.1) 1002 Run (HDU OJ 5365) 暴力枚举+正多边形判定
题目:Click here 题意:给你n个点,有多少个正多边形(3,4,5,6). 分析:整点是不能构成正五边形和正三边形和正六边形的,所以只需暴力枚举四个点判断是否是正四边形即可. #include ...
- application（expand）--easyui
一,效果图. 二,源代码. <!DOCTYPE html><html><head> <meta charset="UTF-8"> & ...
- Android 应用内HttpClient 与 WebView 共享 Cookie
DefaultHttpClient httpclient=....; String toUrl="https://cap.cityu.edu.hk/studentlan/details.as ...
- CentOS 安装easy_install、pip的方法
CentOS 安装easy_install的方法: wget -q http://peak.telecommunity.com/dist/ez_setup.py python ez_setup.py ...
- Python 函数基础、有序集合、文件操作(三)
一.set 特点: set是一个无序且不重复的元素集合访问速度快:天生解决元素重复问题 方法: 初始化 >>> s1 = set()>>> print(type(s ...
- 深入理解-HashMap
一.HashMap概述 HashMap 在家族中位置:实现了Map接口,继承AbstractMap类.HashMap 允许key/value 都为null. 二.HashMap存储结构 HashMap ...
- 理解iOS 8中的Self Sizing Cells和Dynamic Type
http://www.cocoachina.com/ios/20140922/9717.html 在iOS 8中,苹果引入了UITableView的一项新功能--Self Sizing Cells,对 ...
- nginx区分手机与电脑浏览器并进入相应站点
本文要讲的的是如何使用nginx区分pc和手机访问不同的网站,是物理上完全隔离的两套网站(一套移动端.一套pc端),这样带来的好处pc端和移动端 的内容可以不一样,移动版网站不需要包含特别多的内容,只 ...
- opencv鼠标绘制直线 C++版
因为需要在图片上标记直线,所以从网上找了相应的参考资料.但大多都是c风格的,于是自己就写了一个c++风格的. opencv2.4.11,win8.1,vs2013 #include <cv.h& ...
- selenium中用js定位html上没有id，没有name的元素
所测试的页面包含display:none的元素,所以考虑用js,在使用js的过程中,js要获得页面的对象,没有id,没有name ...... <a class="employer&q ...