zoukankan      html  css  js  c++  java
  • [网络收集]Javascript操作Select和Option

    1.动态创建select

          function createSelect(){

           var mySelect = document.createElement("select");
              mySelect.id = "mySelect";  
              document.body.appendChild(mySelect);
          }

    2.添加选项option

         function addOption(){

              //根据id查找对象,
               var obj=document.getElementById('mySelect');

               //添加一个选项
            obj.add(new      Option("文本","值"));    //这个只能在IE中有效
             obj.options.add(new Option("text","value")); //这个兼容IE与firefox
         }

    3.删除所有选项option

         function removeAll(){
               var obj=document.getElementById('mySelect');
      
            obj.options.length=0;  

         }

    4.删除一个选项option

    function removeOne(){
               var obj=document.getElementById('mySelect');

               //index,要删除选项的序号,这里取当前选中选项的序号

            var index=obj.selectedIndex;
            obj.options.remove(index);
      
         }

    5.获得选项option的值

    var obj=document.getElementById('mySelect');

    var index=obj.selectedIndex; //序号,取当前选中选项的序号

    var val = obj.options[index].value;

    6.获得选项option的文本

    var obj=document.getElementById('mySelect');

    var index=obj.selectedIndex; //序号,取当前选中选项的序号

    var val = obj.options[index].text;

    7.修改选项option

    var obj=document.getElementById('mySelect');

    var index=obj.selectedIndex; //序号,取当前选中选项的序号

    var val = obj.options[index]=new Option("新文本","新值");

    8.删除select

          function removeSelect(){
                var mySelect = document.getElementById("mySelect");
            mySelect.parentNode.removeChild(mySelect);
         }

     

    摘自http://www.cnblogs.com/jimchxi/archive/2009/03/12/1409638.html

  • 相关阅读:
    两年的日子,我与你一起度过!
    惠普旋转触屏本TouchSmart tm2开箱视频展示
    你必须知道iPad的10件事
    如果Google统治世界[组图]
    Nexus One运行Android 2.1+Sense UI图赏
    不能只刷机 G3玩家展示给手机外壳刷漆
    这两天的状况不好!
    Google Code上10个有意思的项目
    在虚拟机中如何安装Mac OS X Snow Leopard 10.6
    四大浏览器Windows 7平台多项测试对比
  • 原文地址:https://www.cnblogs.com/lushuicongsheng/p/1889511.html
Copyright © 2011-2022 走看看