<%@ 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. 迭代器.NET实现—IEnumerable和IEnumerator （foreach实现）

    能用foreach遍历访问的对象需要实现什么接口或声明什么方法的类型? 答案:能用foreach遍历访问的对象必须是集合或数组对象,而这些都是靠实现超级接口IEnumerable或被声明 GetEnu ...

  2. UVA136 Ugly Numbers

    题意 PDF 分析 用堆和集合维护即可. 时间复杂度\(O(1500 \log n)\) 代码 #include<iostream> #include<cstdio> #inc ...

  3. 阿里云ESC服务器安装tomcat后无法远程访问

    问题描述:服务器上面没有部署文件,安装了tomcat,在服务器本地能通过"localhost:8080"访问到tom猫页面 但是远程访问“外网ip+:8080”就访问不了 解决方案 ...

  4. setContentHuggingPriority和setContentCompressionResistancePriority的使用

    当两个UILabel并排显示时,如何设置约束,让 leftLB 和 rightLB 正常显示就很重要了. 方案1:左右两个Label的宽度相同,则约束设置如下: //添加标题约束,左边的label [ ...

  5. 10 结构体和类 - —— 《Swift3.0 从入门到出家》

    Swift中的面向对象5个要素:枚举.结构体.类.协议.扩展 面向对象研究的是对象,完成一件事情需要多个对象参与,是生活的映射 Swift中结构体和类非常相似,也就是结构体能完成类的所有功能.结构体是 ...

  6. vuejs angularjs 框架的一些比较（vue项目重构四）

    使用Angularjs和Vue.js对比 首先需要说明的是:现在默认angularjs指angular1.0+版本,angular默认指2.0以上版本.本文的名词也默认指定angular的1.0+版本 ...

  7. leetcode 21.Merge Two Sorted Lists ,java

    题目: Merge two sorted linked lists and return it as a new list. The new list should be made by splici ...

  8. compoer 全局和单个项目切换源 composer update killed

    演示地址: https://blog.csdn.net/hpugym/article/details/72588393 composer update killed https://cloud.ten ...

  9. java中绘图-----那个鼠标等的监听我还是不太会，，好苦恼啊。不知道这些监听事件是怎么区分的

    总结::监听到底该怎么用 事件的区分是靠判断还是 package com.a.b; //我想实现,当我点击一个按钮时,这个frame里可以画出实心的矩形 import java.awt.Color; ...

  10. FTP协议完全详解

    1. 介绍 FTP的目标是提高文件的共享性,提供非直接使用远程计算机,使存储介质对用户透明和可靠高效地传送数据.虽然我们也可以手工使用它,但是它的主要作用是供程序使用的.在阅读本文之前最好能够阅读TC ...