<select>
  <option onclick="test('www.hao123.com')"value="www.hao123.com">hao123</option>
  <option on click="test('www.baidu.com')" value="www.baidu.com">baidu</option>
  <option on click="test('www.google.com')" value="www.google.com">google</option>
</select> <script type="text/javas cript">
  function test(s){
    window.open(s);
  }
</script>

这些代码在Firefox下能正常运行;在IE下不能运行,且没有报错.

最后发现了问题所在:在IE里,select的option是不支持onclick事件的,而在Firefox和 OPERA 里, option 是支持onclick事件的。
那么应该怎么实现原设定的功能?用Select元素的onchange事件。这时主要是考虑如何获得被选中的选项所代表的链接。
修改后代码如下:

<select id="friendLink" on change="test()> 
  <option value="www.hao123.com">hao123</option>
  <option value="www.baidu.com">baidu</option>
  <option value="www.google.com">google</option>
</select> <script type="text/javas cript">
  function test(){
    var targetSlect=document.getElementById("friendLink");
    var targetHref=targetSlect.options[targetSlect.selectedIndex].value;
    window.open(targetHref);
  }
</script>

虽然onchange在某些时刻可以代替 option的click事件, 但是两者并无法做到完全等价. 因为onchange只有在 你点击的option和之前的option不同时才会触发. 当select当前选中的是第一项 而你再次点击第一项时, select是不会被触发的. 下面的代码演示了一种间接实现 option onclick的方法 注意:此方案只适用于下拉方式的单选select.

IE下不支持option的onclick事件的更多相关文章

  1. select中option的onclick事件失效

    html: <select id="pageSelect"> <option value="1" selected onclick=" ...

  2. uGUI使用代码动态添加Button.OnClick()事件(Unity3D开发之十二)

    猴子原创,欢迎转载.转载请注明: 转载自Cocos2Der-CSDN,谢谢! 原文地址: http://blog.csdn.net/cocos2der/article/details/42705885 ...

  3. 谈谈如何给下拉框option添加点击事件?

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

  4. 解决IE6下a标签的onclick事件里的超链接不跳转问题

    今天遇到个很诡异的问题,就是<a href="javascript:void(0);" onclick="window.location=url"> ...

  5. jquery技巧之让任何组件都支持类似DOM的事件管理

    本文介绍一个jquery的小技巧,能让任意组件对象都能支持类似DOM的事件管理,也就是说除了派发事件,添加或删除事件监听器,还能支持事件冒泡,阻止事件默认行为等等.在jquery的帮助下,使用这个方法 ...

  6. JS里的onclick事件

    可以通过以下代码了解JS里的onclick事件: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&quo ...

  7. onclick 事件

    onclick 事件 Event 对象 定义和用法 onclick 事件会在对象被点击时发生. 请注意, onclick 与 onmousedown 不同.单击事件是在同一元素上发生了鼠标按下事件之后 ...

  8. jq动态添加onclick事件在谷歌中不起作用

    $("#oa-bed-rooType").append($('<option/>').val(0).text('请选择房间类型')); $('#oa-bed-roomT ...

  9. 为select的option绑定键盘事件

    1. 目的 可以使用快捷键1.2.3.4等自动选中select框对应的option 2. 代码 <select id="selectItem" class="for ...

随机推荐

  1. 空间的配置和释放 std::alloc

    看完了对象的构造行为和内存释放前的对象的析构行为,我们现在来看看内存的配置和释放. 对象构造前的空间分配和析构后的空间释放,定义在头文件<stl_alloc.h>中.其设计思想是: 向sy ...

  2. SparkStreamingTest.scala

    /** * Created by root on 9/8/15. */ import org.apache.spark._ import org.apache.spark.rdd.RDD import ...

  3. Naive Bayes Algorithm

    朴素贝叶斯的核心基础理论就是贝叶斯理论和条件独立性假设,在文本数据分析中应用比较成功.朴素贝叶斯分类器实现起来非常简单,虽然其性能经常会被支持向量机等技术超越,但有时也能发挥出惊人的效果.所以,在将朴 ...

  4. 用const取代宏定义更好的管理内存

    用const取代宏定义更好的管理内存 宏:只是在预处理器里进行文本替换,没有类型,不做任何类型检查,编译器可以对相同的字符串进行优化.只保存一份到 .rodata 段.甚至有相同后缀的字符串也可以优化 ...

  5. Python 字典排序

    思路是把字典转为列表后再排序 d={'z':1,'y':2,'x':3} # 字典 s=d.items() # [('y', 2), ('x', 3), ('z', 1)] 列表 s.sort() # ...

  6. The Story of self Parameter in Python, Demystified

      转自:http://www.programiz.com/article/python-self-why If you have been programming in Python (in obj ...

  7. Scala中的If判断&While&For循环

    If 判断: object TestScalaIf { def main(args: Array[String]): Unit = { // val resutlt = judge1(-100) // ...

  8. 关于HTML的总结

    现在最新的Html版本是Html5,以前想在网页中做一个效果很费劲,但是现在Html5对标签都进行了封装,想做效果直接用标签就可以了. 以后百分之百是标签的时代.以后写java 就可以用标签.自定义标 ...

  9. (转)linuxmint,ubuntu 下修改guake宽度方法

    之前在网上找到修改guake.py的方式,但是我一直没能找到guake.py的文件,弄的我纠结,后来找到这个文章,这个确实是有效果的 Ubuntu12.04上Guake在唤出的时候滚动条会消失,主要原 ...

  10. html5 之 canvas 相关知识(一)概念及定义

    什么是 Canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canvas 拥有多种绘制路径.矩形.圆形.字符以 ...