javascript各浏览器中option元素的表现差异

1，IE6/7/8/9中无事件(如click,mouseover)，Firefox/Safari/Chrome/Opera则有。


代码如下:

<select id="s1" multiple="multiple">
<option value="1" onclick="alert(1);">1</option>
<option value="2" onclick="alert(2);">2</option>
</select>

示例：

12

2，点击option，通过srcElement获取事件源目标在IE中是select，Firefox/Safari/Chrome/Opera则是option。


代码如下:

<select id="s2" multiple="multiple">
<option value="1" >1</option>
</select>
<script>
document.getElementById('s2').onclick = function(e){
var evt = window.event || e;
var target = evt.srcElement || evt.target;
alert(target.tagName);
}
</script>

示例：

1
//

3，IE6下给option元素添加title属性实现tips功能无效。


代码如下:

<select id="s1" multiple="multiple">
<option value="1" title="tips">1</option>
</select>

示例：

1

赞 (0)

相关推荐

  • js option删除代码集合

    1. JavaScript 复制代码 代码如下: var oSel=document.form1.DropDownCity; while(oSel.options.length>0){ oSel.removeChild(oSel.options[0]); } 2. JavaScript 复制代码 代码如下: <SCRIPT LANGUAGE="JavaScript"> function del1(){ var obj = document.getElementById

  • javascript删除option选项的多种方法总结

    1. JavaScript 复制代码 代码如下: var oSel=document.form1.DropDownCity; while(oSel.options.length>0){ oSel.removeChild(oSel.options[0]); } 2. JavaScript 复制代码 代码如下: <SCRIPT LANGUAGE="JavaScript"> function del1(){ var obj = document.getElementById

  • javascript Select标记中options操作方法集合

    javascript操作Select标记中options集合 先来看看options集合的这几个方法: options.add(option)方法向集合里添加一项option对象: options.remove(index)方法移除options集合中的指定项: options(index)或options.item(index)可以通过索引获取options集合的指定项: javascript代码如下: var selectTag = null; //select标记 var OPTONLEN

  • javascript options属性集合操作代码

    复制代码 代码如下: <form name="testform"> <select name="testselect"> <option value="first">first option</option> <option value="second">second option</option> <option value="third

  • javascript对select标签的控制(option选项/select)

    html中的select标签,也是asp.net中的asp:DropDownList控件. javascript对它们的操作 一.基础理解 复制代码 代码如下: var e = document.getElementById("selectId"); e. options= new Option("文本","值") ; //创建一个option对象,即在<select>标签中创建一个或多个<option value="

  • javascript各浏览器中option元素的表现差异

    1,IE6/7/8/9中无事件(如click,mouseover),Firefox/Safari/Chrome/Opera则有. 复制代码 代码如下: <select id="s1" multiple="multiple"> <option value="1" onclick="alert(1);">1</option> <option value="2" oncl

  • IE6/7/8中Option元素未设value时Select将获取空字符串

    如下 复制代码 代码如下: <!DOCTYPE HTML> <html> <head> <title>IE6/7/8中Option元素未设value时Select将获取空字符串</title> </head> <body> <select onchange="alert(this.value)"> <option>one</option> <option>

  • Javascript实现数组中的元素上下移动

    前言 我们交换数组可以实现元素上下移动了,这个效果我们在表格或以前排序算法中都会用到,下面来看一个JavaScript下实现交换数组元素上下移动例子 在写项目的时候,要实现一个数组记录上下移动的示例.写起来也没有没麻烦,无非是交换数组元素.最终实现代码如下,比较重要的是那个函数. 示例代码: // 交换数组元素 var swapItems = function(arr, index1, index2) { arr[index1] = arr.splice(index2, 1, arr[index

  • 讨论html与javascript在浏览器中的加载顺序问题

    前一阵子横扫了javascript,当时自我感觉良好.现在一想,又觉得没什么.今天的任务是把asp.net ajax中客户端页面生命周期那一章研究完.然而,因为这一章的内容使我产生了一些迷惑.这些疑惑在书中都没有只字提及. 一.html页面的详细加载过程是什么呢?页面元素在加载时的优先级是什么? 二.javascript的作用域.变量的作用域.不同脚本段之间的关系? 三.html页面的生命周期? 这些问题真的打中了我的死穴.不了解这些,我就无法透过asp.net ajax的框架看到其底层原理.只

  • 用javascript修复浏览器中头痛问题的方法整理篇[译]第1/4页

    用javascript修复浏览器中头痛问题的方法整理篇[译]第1/4页

    如果你不了解其中的原由,请不用担心,深入一下CSS的规则并且看一下 Using CSS to Fix Anything: 20+ Common Bugs and Fixes 这个文章. 如果上面那篇文章对你毫无帮助,你可以使用下面12个javascript解决方案的其中之一去修复你的问题,并使你的页面看起来跨所有浏览器! 在本文中,我们将为你在web应用开发中遇到的最常见的CSS问题提供12个javascript解决方案. 你也许会对其它的CSS相关文章感兴趣. Using CSS to Do

  • Javascript遍历table中的元素示例代码

    例如: <table id=tb> <tr><th> </th><th> </th><th> </th><th> </th></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr>&

  • 使用indexOf等在JavaScript的数组中进行元素查找和替换

    复制代码 代码如下: <html> <head> <title> Extend JavaScript Array Method </title> <script language="javascript"> <!-- Array.prototype.indexOf=function(substr,start){ var ta,rt,d='\0'; if(start!=null){ta=this.slice(start);

  • javascript 对象属性property与元素属性attribute的浏览器支持

    var div = document.getElementById('myId'); div.userProperty = 'test2'; alert(div.attributes.length); // IE6/7/8 -> 4 , [id,class,userAttribute,userProperty] // IE9/FF -> 3, [id,class,userAttribute] alert(div.userAttribute); // IE6/7/8 -> 'test1'

  • javascript中获取元素标签中间的内容的实现方法

    使用ajax,通过会把服务器端响应获取到reponseText或者reponseXML中的信息,以某种方法动态的写到div和span标记中,这样,可以在无刷新的情况下,改变页面内容的显示. 通过javascript进行动态的修改,修改的方法有两种: 1. 一种是使用html的每个标记的innerHTML属性,使用此属性,只要为它提供一个有意义的html代码片段,那么html解释器就可以将其中的内容进行解释,并显示在页面上,使用这种方式比较简单,每次修改前不需要先把原来的内容清除掉,而可以直接进行

  • 用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数

    首先这个元素position为fixed top为(clientHeight-elem.offsetHeight)/2(即元素在浏览器的中间,这个是固定的) left为(clientWidht-主体宽度)/2+主体宽度+左边距,左边距可以设为正数,也可以为负数,如果为负数时的绝对值 等于 主体宽度+elem.offsetWidht,那么元素就刚好浮动在页面主体的左边,设置为0时,刚好浮动在页面主体的右边 但是万恶的ie6不支持css中fixed属性,好在ie6可以通过expresion表达式来解

随机推荐