天天看點

jquery多選下拉框左右複制

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>

    <title>Untitled</title>

    <script type="text/javascript" src="xxx/jquery.js"></script>

</head>

<script type="text/javascript">

    function moveToRight(){

        $("#D1 option:selected").each(function(){

            var option = $(this)

            $("#D1").remove(option);

            $("#D2").append(option);

        });

    }

    function moveUp(){

        $('#D2 option:selected').each(function(){

            var option = $(this);

            //alert(option.prev().size());

            if(option.prev().size()!=0){

                option.prev().before(option);

            }

        });

    }

</script>

<body>

    <select size="3" id="D1" multiple>

        <option value="1">a</option>

        <option value="2">b</option>

        <option value="3">c</option>

        <option value="4">d</option>

    </select>

        <input type=button value=">" οnclick="moveToRight()"/>

    <select size="3" id="D2" multiple>

    </select>

        <input type=button value="向上" οnclick="moveUp()"/>

        <input type=button value="向下" οnclick="moveDown()"/>

</body>

</html>

繼續閱讀