如何在firefox下获取下列框选中option的text

zoukankan html css js c++ java

如何在firefox下获取下列框选中option的text

Firefox下面没有innerText,所以我们想在firefox下获取下列框选中option的text（注意不是value）时会比较吃力。笔者结合自己在项目中的解决方案和代码总结一下，请大家指教。

知识点：
0、为什么要innerText？因为安全问题

1、为firefox dom模型扩展属性

2、currentStyle属性可以取得实际的style状态

3、IE实现innerText时考虑了display方式，如果是block则加换行
4、为什么不用textContent？因为textContent没有考虑元素的display方式，所以不完全与IE兼容

代码： 在IE6,7,8 和firefox 2,3下测试均通过。
<html>
<head>
<script language="javascript">

           //If your browser is IE , return true. If is others, like firefox, return false.
           function isIE(){ //ie?
           if (window.navigator.userAgent.toLowerCase().indexOf("msie")>=1)
               return true;
               else
               return false;
           }

           //If is firefox , we need to rewrite its innerText attribute.
           if(!isIE()){ //firefox innerText define
               HTMLElement.prototype.__defineGetter__(     "innerText",
               function(){
               var anyString = "";
               var childS = this.childNodes;
               for(var i=0; i<childS.length; i++) {
                  if(childS[i].nodeType==1)
                   anyString += childS[i].tagName=="BR" ? '\n' : childS[i].textContent;
                  else if(childS[i].nodeType==3)
                   anyString += childS[i].nodeValue;
               }
               return anyString;
               }
               );
               HTMLElement.prototype.__defineSetter__(     "innerText",
               function(sText){
               this.textContent=sText;
               }
               );
           }

           function getSelectedText(name){
           var obj=document.getElementById(name);
           for(i=0;i<obj.length;i++){
               if(obj[i].selected==true){
               return obj[i].innerText;
               }
           }
           }

           function chk(){
           var objText = getSelectedText("mySelect");
           alert("seleted option's text is : "+objText);

           var objValue=document.getElementById("mySelect").value;
           alert("seleted option's value is :"+objValue);
           }
</script>
</head>
<body>
<select id="mySelect">
         <option value="1111">My 1111 hahaha</option>
         <option value="2222">My 2222</option>
         <option value="3333">My 3333</option>
         <option value="4444">My 4444</option>
</select>
<input type="button" name="button" value="see result" onclick="javascript:chk();">
</body>
</html>
当然，如果单独针对下拉框，也可以不用重写innerText，用下面的代码也能实现。重写innerText是为了兼容除下拉框以外的其他的HTML 元素。
<html>
<head>
<script language="javascript">

           function chk(){
           //var objText = getSelectedText("mySelect");
            var obj = document.getElementById("mySelect");
           var objText = obj.options[obj.selectedIndex].text
           alert("seleted option's text is : "+objText);

           var objValue=document.getElementById("mySelect").value;
           alert("seleted option's value is :"+objValue);
           }
</script>
</head>
<body>
<select id="mySelect">
         <option value="1111">My 1111 hahaha</option>
         <option value="2222">My 2222</option>
         <option value="3333">My 3333</option>
         <option value="4444">My 4444</option>
</select>
<input type="button" name="button" value="see result" onclick="javascript:chk();">
</body>
</html>

What Doesn't Kill Me Makes Me Stronger

查看全文

相关阅读:
Expression Bland 入门视频（五）了解对象面板和属性面板
 Windows Phone 一步一步从入门到精通
 “北京今年入冬的第一场雪”，纪念博客园写日志一年了
 2010年即将到来，用我的名字注册了的新域名 TerryFeng.com
我要在黑龙江的老家，组织一个微软.Net俱乐部
 Windows 7 小工具问题步骤记录器
 给弟弟起步学习软件开发(.Net 方向)的指导，博友们帮助看看，提些意见给他。
今天是中国传统节日“重阳节”。也是爷爷的生日，今年80岁高龄。
Windows 7 远程服务器管理工具简体中文下载
 新的技术和概念应该尽可能先去接受，而不是排斥。

原文地址：https://www.cnblogs.com/kungfupanda/p/1765337.html