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 ...
随机推荐
- 写一方法用来计算1+2+3+...n,其中n作为参数输入，返回值可以由方法名返回，也可以由参数返回
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- ubuntu15.04安装hexo
首先吐槽一下npm淘宝源,貌似中国目前唯一一个npm源,现在不好用了,不知道是不是换了地址,在吐槽一下万恶的墙!你懂得. 好了,说点正儿八经的事儿. 之所以安装hexo也是为了创建自己的博客,我只说最 ...
- [HDU 1973]--Prime Path(BFS,素数表)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1973 Prime Path Time Limit: 5000/1000 MS (Java/Others ...
- [Swust OJ 188]--异面空间(读懂题意很重要)
题目链接:http://acm.swust.edu.cn/problem/188/ Time limit(ms): 1000 Memory limit(kb): 65535 江鸟来到了一个很奇怪的 ...
- html5 学习笔记
一.ie8及以下对html5相关语义标签的支持 <!-[if lt IE9]> <script src="html5.js"></script> ...
- jQuery如何设置自增自减值
一直不是很记得jquery中怎么设置自增值,比如当点击按钮时 div在当前宽度基础上增加宽度100px,可以这样写: $('button.test').click(function(){ $('div ...
- WPF中StringFormat 格式化 的用法
原文 WPF中StringFormat 格式化 的用法 网格用法 <my:DataGridTextColumn x:Name="PerformedDate" Header=& ...
- php抓取ajax页面返回图片。
要抓取的页面:http://pic.hao123.com/ 当我们往下滚动的时候,图片是用ajax来动态获取的.这就需要我们仔细分析页面了. 可以看到,异步加载的ajax文件为: http://pic ...
- 组件接口(API)设计指南－文件夹
组件接口(API)设计指南-文件夹 组件接口(API)设计指南[1]-要考虑的问题 组件接口(API)设计指南[2]-类接口(class interface) 组件接口(API)设计指南[3]-托付( ...
- hdu 4885 TIANKENG’s travel(bfs)
题目链接:hdu 4885 TIANKENG's travel 题目大意:给定N,L,表示有N个加油站,每次加满油能够移动距离L,必须走直线,可是能够为斜线.然后给出sx,sy,ex,ey,以及N个加 ...