左右两部分 中间选择按钮(添加,删除)

来源:互联网 发布:sony签约网络经销商 编辑:程序博客网 时间:2024/05/29 19:14
<script type="text/javascript">window.onload = function() {    // 获取两个 select 和两个 button    var select_left = document.getElementById("left"),        select_right = document.getElementById("right"),        button_add = document.getElementById("add"),        button_delete = document.getElementById("delete");                                // 点击添加    button_add.onclick = function() {        // 获取左边被选择的 option 的索引        var idx = select_left.selectedIndex;        // 如果左边有 option 被选择        if(idx !== -1) {alert(select_left[idx].value);            // 将此 option 移动到右边            select_right.appendChild(select_left[idx]);        }else{alert('必须选择一个');}    };                                // 点击删除    button_delete.onclick = function() {        // 获取右边被选择的 option 的索引        var idx = select_right.selectedIndex;        // 如果右边有 option 被选择        if(idx !== -1) {            // 将此 option 移动到左边            select_left.appendChild(select_right[idx]);        }    };};</script>
<select id="left" size="10" style="width: 100px;"><option value="cpp">++</option><option value="java">JAVA</option><option value="html">HTML</option><option value="css">CSS</option><option value="js">JavaScript</option><option value="php">PHP</option></select>        <div style="display: inline-block;"><input type="button" id="add" value="添加" /><input type="button" id="delete" value="删除" /></div>        <select id="right" size="10" style="width: 100px;">        </select>


原创粉丝点击