zoukankan      html  css  js  c++  java
  • js实例7表框选项

    <style type="text/css">
    *{ margin:0px auto; padding:0px}
    #wai{ 500px; height:500px}
    #left{ 200px; height:500px; float:left}
    #zhong{ 100px; height:500px; float:left}
    #right{ 200px; height:500px; float:left}
    </style>
    </head>

    <body>
    <br />
    <div id="wai">
    <div id="left">
    <select style="200px; height:300px" id="selleft" multiple="multiple">
    <option value="山东">山东</option>
    <option value="淄博">淄博</option>
    <option value="张店">张店</option>
    </select>
    </div>
    <div id="zhong">
    <div style="margin-left:10px; margin-top:20px">
    <input style="60px; height:30px" type="button" value=">>" onclick="moveall()" />
    </div>

    <div style="margin-left:10px; margin-top:30px">
    <input style="60px; height:30px" type="button" value=">" onclick="moveone()" />
    </div>
    </div>
    <div id="right">
    <select id="selright" multiple="multiple" style="200px; height:300px"></select>
    </div>
    </div>


    <script type="text/javascript">

    function moveone()
    {
    var left = document.getElementById("selleft");
    var right = document.getElementById("selright");

    var xz = left.value;
    var str = "<option value='"+xz+"'>"+xz+"</option>";
    //判断
    //alert(right.childNodes.item(0));
    var bs = 0;
    for(var i=0;i<right.childNodes.length;i++)
    {
    if(right.childNodes.item(i).text==xz)
    {
    bs = 1;
    }
    }

    if(bs==0)
    {
    //追加
    right.innerHTML = right.innerHTML+str;
    }
    }

    function moveall()
    {
    var left = document.getElementById("selleft");
    var right = document.getElementById("selright");

    right.innerHTML = left.innerHTML;
    }

    </script>

  • 相关阅读:
    网站如何做404错误页面
    阿里云虚拟主机二级域名绑定二级目录以及域名重定向的用法
    301重定向的方法
    利用JavaScript做无缝滚动
    day 10
    day 9
    day 9
    day 8
    day 8
    day 7
  • 原文地址:https://www.cnblogs.com/qdlj/p/6188443.html
Copyright © 2011-2022 走看看