<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication9.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <link href="jquery.ui.all.css" rel="stylesheet" />

    <link href="jquery.ui.theme.css" rel="stylesheet" />

    <link href="jquery-ui.css" rel="stylesheet" />

    <link href="ui.jqgrid1.css" rel="stylesheet" />

    <script src="Scripts/jquery-1.8.1.min.js"></script>

    <script src="Scripts/jquery.jqGrid.min.js"></script>

    <script type="text/javascript">

        function moveToRight(select1, select2)//把选中的移动到右边 sleect1和sleect2分别是下拉列表框的ID

        {

            alert();

            $("#mask").show();

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

                $("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>").appendTo("#" + select2 + "");

                $(this).remove();

            });

            $("#mask").hide();

        }

        function moveAllToRight(select1, select2)//把所有的移动到右边

        {

            $('#' + select1 + ' option').each(function () {

                $("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>").appendTo("#" + select2 + "");

                $(this).remove();

            });

        }

        function moveToLeft(select1, select2)//把选中的移动到左边

        {

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

                $("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>").appendTo("#" + select1 + "");

                $(this).remove();

            });

        }

        function moveAllToLeft(select1, select2)//把所有的移动到左边

        {

            $('#' + select2 + ' option').each(function () {

                $("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>").appendTo("#" + select1 + "");

                $(this).remove();

            });

        }

        $.fn.GetPostData = function () {

            alert("ssss");

        }

        $(function () {

            $("#btn").on("click", function () {

                $("#tabs").GetPostData();

            })

            $('#sel2').bind('dblclick', function (event) {//给下拉框绑定双击事件

                moveToRight('sel2', 'sel3');

            });

            $('#sel3').bind('dblclick', function () {

                moveToLeft('sel2', 'sel3');

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

           <%-- 自定义遮罩--%>

        <div class="window-mask" id="mask" style="width: 100%; height:1000px; display: none; z-index: 9000;background-color:red;"></div>

        <select id="sel2" multiple="multiple" style="width: 100px;">

            <option selected="selected">1.1</option>

            <option>1.2</option>

            <option>1.3</option>

        </select>

        <select id="sel3" multiple="multiple" style="width: 100px;"></select>

    </form>

</body>

</html>

jquery select 左右移动的更多相关文章

  1. jquery select取值，赋值操作

    select">jquery select取值,赋值操作 一.获取Select 获取select 选中的 text : $("#ddlRegType").find( ...

  2. jquery select选中表单特效三级联动

    好久没发帖了,今天发一个jquery select的表单三级联动,希望能对有需要的朋友有点帮助. js代码,当然还要加上jquery的包,应该都有的,这里就不发了. <script type=& ...

  3. jQuery select的操作代码

    jQuery對select的操作的实际应用代码. //改變時的事件  复制代码代码如下: $("#testSelect").change(function(){ //事件發生  j ...

  4. 基于jQuery select下拉框美化插件

    分享一款基于jQuery select下拉框美化插件.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览   源码下 ...

  5. jQuery select的操作实现代码

          //改变时的事件  $("#testSelect").change(function(){ //事件发生生 jQuery('option:selected', this ...

  6. jquery select()方法 语法

    jquery select()方法 语法 作用:当 textarea 或文本类型的 input 元素中的文本被选择时,会发生 select 事件.select() 方法触发 select 事件,或规定 ...

  7. 异步实时搜索jquery select插件

    异步实时搜索jquery select插件 一.先看看效果. 二.做此插件的原因. 1.数据量过大(几千.几万条),无法一次性全部加载. 2.现有插件各不相同,无法满足功能需求. 3.美观性,可控性不 ...

  8. jquery select操作大全

    添加option $("#ID option").each(function(){ if($(this).val() == 111){ $(this).remove(); } }) ...

  9. jQuery Select 自动选择默认值

    ////// the Select target Auto Select value extension plugin // // ---------------------------------- ...

  10. jQuery Select的操作集合

    1. $("#select_id").change(function(){... });   //为select添加事件,当选择其中一项时触发2. $("#select_ ...

随机推荐

  1. Django--django-admin.py on windows does not work

    使用命令:Python django-admin.py startproject projectname 使用django-admin.py startapp myblog没有创建新的app,使用下面 ...

  2. 几个ADB常用命令

    http://blog.163.com/ymguan@yeah/blog/static/14007287220133149477594/ 1. 显示当前运行的全部模拟器:    adb devices ...

  3. 微软发布WCF教程及大量示例

    继前面 微软公司发布Windows Communication Foundation (WCF)和Windows CardSpace的示例程序之后,微软今天又发布了WF的教程和大量示例,对于学习WF的 ...

  4. 设置正确的DNS

    上网或下载软件慢问题,除去少数设备陈旧.感染病毒.网卡硬件故障和网卡驱动错误方面的因素,绝大部分原因是由于部分上网电脑或家用无线路由器设置了错误的DNS造成的,正确的方法是应该在电脑或路由器上使用本地 ...

  5. SQL TINYINT 1 讨论记录

    SQL TINYINT 1 讨论记录 群里有一位小伙伴又和他上司怒上了,关于 TINYINT 1 的问题. 这里记录一下,TINYINT 无符号可以是 0~255,而这里的 长度 1只是长度,并不是存 ...

  6. Ehcache入门介绍一

    EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernate中默认的CacheProvider. 特性有: 1. 快速轻量 Ehcache的线程机制是为大型高并发系统设 ...

  7. python----python使用mysql

    Python操作MySQL主要使用两种方式: 原生模块 pymsql ORM框架 SQLAchemy pymql pymsql是Python中操作MySQL的模块,在windows中的安装: pip ...

  8. leetcode452

    public class Solution { public int FindMinArrowShots(int[,] points) { // multidimensional array cann ...

  9. log4net 入门教程

    1.下载dll 下载地址:http://mirror.reverse.net/pub/apache/logging/log4net/binaries/ github:https://github.co ...

  10. Stall Reservations（贪心+优先队列）

    Description Oh those picky N (1 <= N <= 50,000) cows! They are so picky that each one will onl ...