选项左右移动

最新推荐文章于 2024-07-25 11:52:08 发布

别有滋味

最新推荐文章于 2024-07-25 11:52:08 发布

阅读量314

点赞数

分类专栏： Jquery 文章标签： button function input server html div

Jquery 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script src="JS/jquery-1.3.2.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(function() {
            $("#Button1").click(function() {
                $selected = $("#Select1 option:selected");
                $selected.appendTo("#Select2");
                
            });
            $("#Button2").click(function() {
                $selected = $("#Select2 option:selected");
                $selected.appendTo("#Select1");
              
            });
            $("#Button3").click(function() {
           
                $noselected = $("#Select1 option")
                $noselected.appendTo("#Select2");
            });
            $("#Button4").click(function() {
              
                $noselected = $("#Select2 option")
                $noselected.appendTo("#Select1");
            });


        })</script>

    <style type="text/css">
        #Select2
        {
            width: 72px;
            height: 123px;
            margin-right: 1px;
        }
        #Select1
        {
            width: 73px;
            height: 117px;
        }
    </style>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <select id="Select1" multiple="multiple">
            <option>张三</option>
            <option>李四</option>
            <option>王五</option>
            <option>赵六</option>
            <option>田七</option>
        </select>
        <input id="Button1" type="button" value=">>" />
        <input id="Button2" type="button" value="<<" />
        <select id="Select2" multiple="multiple">
            <option></option>
        </select>
        <input id="Button3" type="button" value="全部右移" />
        <input id="Button4" type="button" value="全部左移" />
        <br />
    </div>
    </form>
</body>
</html>

别有滋味

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
选项左右移动

$(function() { $("#Button1").click(function() { $selected = $("#Select1 option:selected"); $selected.appendTo("#Select2");
复制链接

扫一扫

专栏目录