我们在用到下拉列表框select时,需要对选中的<option>选项触发事件,其实<option>本身没有触发事件方法,我们只有在select里的onchange方法里触发。

当我们触发select的双击事件时,用ondblclick方法。
当我们要取得select的选中事件时,用document.all['name'].value来获取,其中name是select的名称。
如果我们要得到select的全部的值就用一个for循环来实现。代码如下:

var vi = document.all['list'].length;
for(var i=;i<vi;i++){
document.form2.list(i).value; //form2是<form>的名称
}

下面介绍一个特殊情况的解决,由于option本身没有事件,所以我们不能给每个option都添加一个onclick事件。如果需要实现点击不同的option,实现不同的函数时,要怎么办,从value里取值在分析是一种办法,但如果value里的值不确定,我们又不想从value里取值怎么办呢?可以这样解决,给每个option添加一个属性,然后在赋一个值,我们在函数里取到这个属性的值就可以判断执行了。

<select id="pid" onchange="gradeChange()">
<option grade="" value="a">选项一</a>
<option grade="" value="b">选项二</a>
</select>
<script type="text/javascript">
function gradeChange(){
var objS = document.getElementByIdxx_x("pid");
var grade = objS.options[objS.selectedIndex].grade;
alert(grade);
}
</script>

实现 select中指定option选中触发事件的更多相关文章

  1. LayUI中select下拉框选中触发事件

    代码: var form = layui.form, layer = layui.layer; // 监听 $(document).ready(function() { // select下拉框选中触 ...

  2. 删除select中所有option选项jquery代码

    select中所有option选项如何删除,本文使用jquery简单实现下,有此需求的朋友可以参考下,希望对大家有所帮助. 这样写 复制代码代码如下: <select id="sear ...

  3. 根据select中选定option触发不同事件

    做公司项目,要实现一个小需求,根据下拉框选定的数据,绑定不同的事件.我的思路是获取select下面的option值,然后给它们定义不同的点击事件,但是在使用中option不能添加类,同时没有click ...

  4. Vue.js之下拉列表及选中触发事件

    老早就听说了Vue.js是多么的简单.易学.好用等等,然而我只是粗略的看了下文档,简单的敲了几个例子,仅此而已. 最近由于项目的需要,系统的看了下文档,也学到了一些东西. 废话不多说,这里要说的是下拉 ...

  5. 关于select下拉框选择触发事件

    最开始使用onclick设置下拉框触发事件发现会有一些问题: <select> <option value="0" onclick="func0()&q ...

  6. denounce函数:Javascript中如何应对高频触发事件

    在DOM Event的世界中,以scroll.resize.mouseover等为代表的高频触发事件显得有些与众不同.通常,DOM事件只有在明确的时间点才会被触发,比如被点击,比如XMLHttpReq ...

  7. select下拉框选择触发事件

    我一直以来都认为,select 下拉框选择对选项 options 使用 onclick 注册事件即可,如下: <select> <option value="0" ...

  8. jquery新增,删除 ,修改,清空select中的option

    jQuery获取Select选择的Text和Value: 1. var checkText=jQuery("#select_id").find("option:selec ...

  9. 使用jQuery中trigger()方法自动触发事件

    一.常用事件 在页面加载完成时  自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click") ...

随机推荐

  1. 修改 Mac 默认 PHP 运行环境,给 MAMP 配置全局 Composer

    在没有配置全局性的 Composer 的时候,如果你在没有安装 Composer 的目录下运行 Composer 命令,比如:create-project 系统会返回: Could not open ...

  2. perl 回调必须是函数引用

    [root@wx03 lib]# cat a1.pl use AE; use AnyEvent; ##定义watch my $t = AnyEvent->timer( after => 0 ...

  3. codeforces 316F3 Suns and Rays

    题目在此 找出中有多少个太阳以及每个太阳的散发线段. 算法 原图: 将图"缩小",如果一个白点的四周有黑点,那么把这个白点变成黑点: 将图"放大",即上述&qu ...

  4. MySQL主键添加/删除

    2改动数据库和表的字符集alter database maildb default character set utf8;//改动数据库的字符集alter table mailtable defaul ...

  5. HTTP的请求头标签If-Modified-Since

    一直以来没有留意过HTTP请求头的IMS(If-Modified-Since)标签. 最近在分析Squid的access.log日志文件时,发现了一个现象. 就是即使是对同一个文件进行HTTP请求,第 ...

  6. 总线接口与计算机通信(一)I2C总线

    1.  I2C总线的基本概念    1)发送器(Transmitter):发送数据到总线的器件    2)接收器(Receiver):从总线接收数据的器件    3)主机(Master):初始化发送. ...

  7. 复合文档的二进制存储格式研究[ole存储结构](word,xls,ppt...)[转]

    复合文档文件格式研究   前 言 复合文档(Compound Document) 是一种不仅包含文本而且包括图形.电子表格数据.声音.视频图象以及其它信息的文档.可以把复合文档想象成一个所有者,它装着 ...

  8. WCF技术剖析之十七:消息(Message)详解(下篇)

    原文:WCF技术剖析之十七:消息(Message)详解(下篇) [爱心链接:拯救一个25岁身患急性白血病的女孩[内有苏州电视台经济频道<天天山海经>为此录制的节目视频(苏州话)]]< ...

  9. Caffe —— Deep learning in Practice

    因工作交接须要. 要将caffe用法及总体结构描写叙述清楚. 鉴于也有同学问过我相关内容, 决定在本文中写个简单的tutorial, 方便大家參考. 本文简单的讲几个事情: Caffe能做什么? 为什 ...

  10. Linux 安装ibus极点五笔输入法备忘录

    Linux 安装 ibus 五笔输入法备忘录 useful?: https://github.com/definite/ibus-table-chinese 一. yum install ibus* ...