xiaoniao

javascript小经验

获取select选定的元素
var   Obj   =   document.getElementById("selectID"); 
Obj.option[Obj.selectedIndex].value
如何用Javascript的内置函数把以逗号分开的字符串转化成一个数组。然后输出数组。 
  <script> 
  str="a,b,c" 
  arr=str.split(","); 
  for(i=0;i<arr.length;i++)alert(i+":"+arr[i]) 
  </script> 
如何用自己写的函数把以逗号分开的字符串转化成一个数组。然后输出数组。 
  <script> 
  str="o,m,n" 
  arr=split2(str); 
  for(i=0;i<arr.length;i++)alert(i+":"+arr[i]) 
  function   split2(tmp){ 
  return   tmp.match(/([^,]+)/g) 
  } 
  </script> 

Example:
<html>
<head>
    <title></title>

    <script language="javascript">       
        function Add(objA,objB)
        {
            var tem=new Array();
            with(objA)
            for(i=length-1;i>=0;i--)
                if(options[i].selected){tem[tem.length]=new Option(options[i].text,options[i].value);}
           
            if(objA.selectedIndex>-1)
            {
                for(i=0;i<objB.length;i++) tem[tem.length]=objB.options[i];
                with(objB)
                {
                    length=0;
                    tem.sort(sortArr);
                    for(i=0;i<tem.length;i++) options[length]=new Option(tem[i].text,tem[i].value)
                }
            }   
        }
       
        function sortArr(a,b)
        {
            if(a.text>b.text)return 1;
            if(a.text<b.text)return -1;
            return 0;
        }
        //   
       
        //
        function up(obj)
        {       
            var objO = new Option(obj.options[obj.selectedIndex].text,obj.options[obj.selectedIndex].value);   
           
            var selectedIndex = obj.selectedIndex;
            if(selectedIndex>0)
            {               
                obj.options[selectedIndex].text = obj.options[selectedIndex-1].text;
                obj.options[selectedIndex].value = obj.options[selectedIndex-1].value;
               
                obj.options[selectedIndex-1].text = objO.text;
                obj.options[selectedIndex-1].value = objO.value;
               
                obj.selectedIndex = selectedIndex-1;       
            }
        }
        //
       
        //
        function down(obj)
        {       
            var objO = new Option(obj.options[obj.selectedIndex].text,obj.options[obj.selectedIndex].value);   
           
            var selectedIndex = obj.selectedIndex;
            if(selectedIndex<obj.options.length-1)
            {               
                obj.options[selectedIndex].text = obj.options[selectedIndex+1].text;
                obj.options[selectedIndex].value = obj.options[selectedIndex+1].value;
               
                obj.options[selectedIndex+1].text = objO.text;
                obj.options[selectedIndex+1].value = objO.value;
               
                obj.selectedIndex = selectedIndex+1;
            }
        }
        //
       
        // 双击时添加到b
        function dba(objA,objB)
        {           
            var objO=new Option(objA.options[objA.selectedIndex].text,objA.options[objA.selectedIndex].value)
            objB.add(objO);
        }
        //
        // 双击时删除b
        function dbb(obj)
        {
            obj.removeChild(obj.options[obj.selectedIndex]);
        }
        //
       
        // 删除b中选中的项
        function del(obj)
        {       
            for(var i=obj.options.length-1;i>=0;i--)
            {
                if(obj.options[i].selected)
                {
                    obj.removeChild(obj.options[i]);
                }
            }           
        }
        //
       
        //
        function getvalue(obj)
        {
            var str="";
           
            for(var i=0;i<obj.options.length;i++)
            {
                if(str.length>0)
                    str = str + "," + obj.options[i].value;
                else
                    str = obj.options[i].value;
            }
           
            document.getElementById("selectValue").innerText = str;
        }
        //
    </script>

</head>
<body bgcolor="#CCCCCC">
    <table cellspacing="0" cellpadding="0" width="448" border="0">
        <tr>
            <td width="45%" align="center">
                <select style="width: 155px" multiple size="15" name="a" ondblclick="dba(this,document.getElementById('b'))">
                    <option value="av1" title="av1">at1</option>
                    <option value="av2" title="av2" style="background-color:#999999">at2</option>
                    <option value="av3" title="av3">at3</option>
                    <option value="av4" title="av4">at4</option>
                    <option value="av5" title="av5">at5</option>
                    <option value="av6" title="av6">at6</option>
                    <option value="av7" title="av7">at7</option>
                </select>
            </td>
            <td>
                <input onClick="Add(document.getElementById('a'),document.getElementById('b'))" type="button"
                    value="&gt;&gt;" style="width: 40px">
                <br>
                <input onClick="del(document.getElementById('b'))" type="button" value="Del" style="width: 40px">
                <br>
                <input onClick="up(document.getElementById('b'))" type="button" value="b↑" style="width: 40px">
                <br>
                <input onClick="down(document.getElementById('b'))" type="button" value="b↓" style="width: 40px">
            </td>
            <td width="45%" align="center">
                <select style="width: 155px" multiple size="15" name="b" ondblclick="dbb(this)">
                    <option value="bv1">bt1</option>
                    <option value="bv2">bt2</option>
                    <option value="bv3">bt3</option>
                    <option value="bv4">bt4</option>
                    <option value="bv5">bt5</option>
                    <option value="bv6">bt6</option>
                    <option value="bv7">bt7</option>
                    <option value="bv8">bt8</option>
                </select>
            </td>
        </tr>
        <tr>
            <td colspan="3" align="center">
                <input type="button" name="button1" value="获得右边select值" onClick="getvalue(document.getElementById('b'))"></td>
        </tr>
        <tr>
            <td colspan="3" align="center">
                <div id="selectValue">
                </div>
            </td>
        </tr>
    </table>
</body>
</html>

posted on 2007-07-05 08:32 小鸟 阅读(442) 评论(0)  编辑  收藏


只有注册用户登录后才能发表评论。


网站导航:
 
<2007年7月>
24252627282930
1234567
891011121314
15161718192021
22232425262728
2930311234

导航

统计

常用链接

留言簿(1)

随笔分类

随笔档案

文章档案

搜索

最新评论

阅读排行榜

评论排行榜