现在有一个Id为AreaId的下拉框,要获取它当前选择项的文本和值有以下方法:
<span class="red">* </span>
地 区:
<span>
<select id="AreaId" name="AreaId" size="1" class="sel">
<option>-请选择地区-</option>
<option value="1">北京</option>
<option value="2">上海</option>
<option value="3">深圳</option>
</select>
</span>
方法一:使用JavaScript原生态的方法.
1.获取值:
document.getElementById("AreaId").value;//有效,能得到正确的值. var index=document.getElementById("AreaId").selectedIndex;//获取当前选择项的索引.
document.getElementById("AreaId").options[index].value;//获取当前选择项的值.
var obj=document.getElementById("AreaId");
for(i=0;i<obj.length;i++) {//下拉框的长度就是它的选项数.
if(obj[i].selected==true) {
var text=obj[i].value;//获取当前选择项的值.
}
}
2.获取文本:
var index=document.getElementById("AreaId").selectedIndex;//获取当前选择项的索引.
document.getElementById("AreaId").options[index].text;//获取当前选择项的文本. document.getElementById("AreaId").options[index].innerHTML;//获取当前选择项的文本. var obj=document.getElementById("AreaId");
for(i=0;i<obj.length;i++) {//下拉框的长度就是它的选项数.
if(obj[i].selected==true) {
var text=obj[i].text;//获取当前选择项的文本.
}
}
document.getElementById("AreaId").text;//注意,这句代码无效,得到的结果为undefined.
方法二:使用JQuery方法(前提是已经加载了jquery库).
1.获取值:
$("#AreaId").val();//获取当前选择项的值.
var options=$("#AreaId option:selected");//获取当前选择项.
options.val();//获取当前选择项的值.
2.获取文本:
var options=$("#AreaId option:selected");//获取当前选择项.
options.text();//获取当前选择项的文本. options.innerHTML();//获取当前选择项的文本. $("#AreaId").text;//注意,这句代码无效,得到的结果为undefined.
其他属性:
innerText: var index=document.getElementById("AreaId").selectedIndex;//获取当前选择项的索引.
document.getElementById("AreaId").options[index].innerText;//获取当前选择项的文本,IE支持,Firefox不支持. document.getElementById("AreaId").innerHTML;//获取当前下拉框所有的元素,包括Html代码.注意大小写.
document.getElementById("AreaId").textContent;//获取当前下拉框中所有的选择项文本,不包括Html代码.
感谢您怀着耐心看完整篇博文!!!
如果文章有什么错误或不当之处,请您斧正!
您有任何意见或者建议,您可以给我发邮件,也可以在下面留言,我看到了会第一时间回复您的,谢谢!
Js获取下拉框当前选择项的文本和值的更多相关文章
-
Js获取下拉框选定项的值和文本
Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...
-
原生js获取下拉框下标
// 获取下拉框所选下标 传入下拉框的id function getselectscheckitemindex (idStr) { let o = document.getElementById(id ...
-
js总结:利用js获取下拉框的value值和文本值
select下拉框在项目开发中是经常用到的,特别是在联级菜单方面的应用更为广泛.但是,对于一些初学者来说,如何获取下拉框子节点option的value值和文本内容,还是有一点难度的. html代码: ...
-
js获取下拉框的值
获取select 选中的option的值: $("#ddlRegType").find("option:selected").val(); 获取select ...
-
Js获取下拉框的值和文本select
$("#camera").change(function () { var obj = this; $("#camera_Name" ...
-
js获取下拉框当前选中的值并弹出
this.options[this.selectedIndex].value --- 显示文本 this.value --- 实际存储值 调用实例: <script language=" ...
-
js 获取 下拉框的值
//错误 console.log($("#DictID").select.val()); //错误 console.log($("#DictID").selec ...
-
js获取下拉框的value值
var Resultstr=""; var param = { action: "MoneyList" };//参数拼接 $.ajax({ type: &quo ...
-
js,jquery获取下拉框选中的option
js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; ...
随机推荐
-
Windows IIS 安装配置PHP环境
一. 概述 二.安装PHP 1.到php官网下载最新版PHP http://windows.php.net/download 三.配置IIS PHP环境
-
HDU 1421 DP
搬寝室 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submiss ...
-
【兄弟连】2016高洛峰新版PHP培训视频教程
[兄弟连]2016高洛峰新版PHP培训视频教程 视频部分目录: 下载地址:http ...
-
host文件的作用和介绍
在Window系统中有个Hosts文件(没有后缀名)在Windows98系统下该文件在Windows目录,在Windows2000/XP系统中位于C:\Winnt\System32\Drivers\E ...
-
深入浅出多线程——ReentrantLock (一)
ReentrantLock是一个排它重入锁,与synchronized关键字语意类似,但比其功能更为强大.该类位于java.util.concurrent.locks包下,是Lock接口的实现类.基本 ...
-
关于更改ListBox的ItemsPanel样式
首先定义一个ListBoxItem的样式,用来显示相应的图片信息 <Style TargetType="{x:Type ListBoxItem}" > <Sett ...
-
JavaScript对象复制(二)
<script> function copy(a) { ret = {}; for (sth in a) { temp = a[sth]; if (temp instanceof Arra ...
-
mongoDB(Linux)
启动 service mongod start 安装好后,输入mongo进入控制台 创建数据库 use baseName db.createCollection("game_record& ...
-
es6 class 了解
ES6之class ES5中通常通过构造函数和原型的组合形式来创建对象.在ES6中引入class作为对象模板, Class定义语法 class point{ constructor(x,y){ thi ...
-
InnoDB 5.6 新特性之一:FullTEXT Indexes[1.简单介绍]
先来看一条SQL语句: SELECT * FROM aa where acol like '%like_normal%'; 当我们使用Innodb时,无论如何对这条语句进行优化,都是无意义的:有的人会 ...