listbox多选实现上下移动 js版和服务器版

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="X200906021128.aspx.cs" Inherits="ListBoxs_X200906021128" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head runat="server">

    <title></title>

    <script type="text/javascript">

        function MoveUP(fElement)

        {

            if (fElement.options.length == 0 || fElement.options[0].selected) return;

            for (var i = 1; i < fElement.options.length; i++)

            {

                if (fElement.options[i].selected)

                {

                    var text = fElement.options[i].text;

                    var value = fElement.options[i].value;

                    var selected = fElement.options[i].selected;

                    fElement.options[i].text = fElement.options[i - 1].text;

                    fElement.options[i].value = fElement.options[i - 1].value;

                    fElement.options[i].selected = fElement.options[i - 1].selected;

                    fElement.options[i - 1].text = text;

                    fElement.options[i - 1].value = value;

                    fElement.options[i - 1].selected = selected;

                }

            }

        }

        function MoveDown(fElement)

        {

            if (fElement.options.length == 0 || fElement.options[fElement.options.length - 1].Selected) return;

            for (var i = fElement.options.length - 1; i > -1; i--)

            {

                if (fElement.options[i].selected)

                {

                    var text = fElement.options[i + 1].text;

                    var value = fElement.options[i + 1].value;

                    var selected = fElement.options[i + 1].selected;

                    fElement.options[i + 1].text = fElement.options[i].text;

                    fElement.options[i + 1].value = fElement.options[i].value;

                    fElement.options[i + 1].selected = fElement.options[i].selected;

                    fElement.options[i].text = text;

                    fElement.options[i].value = value;

                    fElement.options[i].selected = selected;

                }

            }

        }

    </script>

</head>

<body>

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

    <div>

        <asp:ListBox ID="fListBox" runat="server" Height="200px" SelectionMode="Multiple" Width="200px"></asp:ListBox>

        <br />

        <br />

        --- Server Side ------------------------------------------------------

        <br />

        <br />

        <asp:Button ID="btnUp" runat="server" onclick="btnUp_Click" Text="Up" />

        <asp:Button ID="btnDown" runat="server" onclick="btnDown_Click" Text="Down" />

        <br />

        <br />

        --- Client Side ------------------------------------------------------

        <br />

        <br />

        <input type="button" value="UP" onclick="MoveUP(document.getElementById('fListBox'));" />

        <input type="button" value="Down" onclick="MoveDown(document.getElementById('fListBox'));" />

        <br />

         用 Ctrl + 鼠标 或 Ctrl + Shift 鼠标，实现多选或间断多选

    </div>

    </form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class ListBoxs_X200906021128 : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            for (int i = 0; i < 20; i++)

                fListBox.Items.Add(i.ToString());

        }

    }

    protected void btnUp_Click(object sender, EventArgs e)

    {

        // 没有项，或第一个选中节点已经是第一项，则不处理

        if (this.fListBox.Items.Count == 0 || this.fListBox.Items[0].Selected) return;

        for (int i = 1; i < this.fListBox.Items.Count; i++)

        {

            if (this.fListBox.Items[i].Selected)

                this.ChangeProperty(this.fListBox.Items[i - 1], this.fListBox.Items[i]);

        }

    }

    protected void btnDown_Click(object sender, EventArgs e)

    {

        // 没有项，或最后一个选中节点已经是第一项，则不处理

        if (this.fListBox.Items.Count == 0 || this.fListBox.Items[this.fListBox.Items.Count - 1].Selected) return;

        for (int i = this.fListBox.Items.Count-1; i >-1 ; i--)

        {

            if (this.fListBox.Items[i].Selected)

                this.ChangeProperty(this.fListBox.Items[i], this.fListBox.Items[i+1]);

        }

    }

    private void ChangeProperty(ListItem fFront, ListItem fCurrent)

    {

        string fText = fFront.Text;

        string fValue = fFront.Value;

        bool fSelected = fFront.Selected;

        fFront.Text = fCurrent.Text;

        fFront.Value = fCurrent.Value;

        fFront.Selected = fCurrent.Selected;

        fCurrent.Text = fText;

        fCurrent.Value = fValue;

        fCurrent.Selected = fSelected;

    }

}

listbox多选实现上下移动 js版和服务器版的更多相关文章

Ubuntu桌面版与服务器版有什么不同?
提到安装Linux,Ubuntu可谓是最受欢迎的.为了满足每个人的需求,出现了不少版本或风格的Ubuntu;其中两项便是桌面版与服务器版.只要发布版本号一致,这两者从核心来说也就是相同的,唯 ...
Ubuntu桌面版与服务器版的区别（转）
Ubuntu桌面版vs服务器版提到安装Linux,Ubuntu可谓是最受欢迎的.为了满足每个人的需求,出现了不少版本或风格的Ubuntu:其中两项便是桌面版与服务器版.只要发布版本号一致,这两者从核 ...
微信支付开发(1) JS API支付V3版（转）
http://www.cnblogs.com/txw1958/p/wxpayv3-jsapi.html 本文介绍微信支付下的jsapi实现流程前言微信支付现在分为v2版和v3版,2014年9月10 ...
ListBox复选框拓展
Toolkit的LongListMutiSelector的复选框功能,想必许多人都需要吧!然而系统本身控件ListBox虽然也有多选功能,可是外观上却缺乏复选框,选择效果只是颜色变化.于是在上一个项目 ...
js操作文件 HTML5版
js操作文件 HTML5版,有需要的朋友可以参考下. <!DOCTYPE html> <html> <head> <title>JSFileReader ...
你不知道的 JS (系列丛书) - 第二版
你不知道的 JS (系列丛书) - 第二版 You Don't Know JS (book series) - 2nd Edition https://github.com/learning-js-b ...
使用 js 实现一个简易版的模版引擎
使用 js 实现一个简易版的模版引擎 regex (function test() { this.str = str; })( window.Test = ...; format() { let ar ...
使用 js 实现一个简易版的 drag & drop 库
使用 js 实现一个简易版的 drag & drop 库具有挑战性的前端面试题 H5 DnD js refs https://www.infoq.cn/article/0NUjpxGrqRX ...
使用 js 实现一个简易版的动画库
使用 js 实现一个简易版的动画库具有挑战性的前端面试题 animation css refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE x ...

随机推荐

Lucene 实例教程(二)
原创作品,允许转载,转载时请务必以超链接形式标明文章原始出处 .作者信息和本人声明.否则将追究法律责任. 作者: 永恒の_☆ 地址: http://blog.csdn.net/chenghui031 ...
和S5933比较起来，开发PLX9054比较不幸，可能是第一次开发PCI的缘故吧。因为，很多PCI的例子都是对S5933，就连微软出版的《Programming the Microsoft Windows Driver Model》都提供了一个完整的S5933的例子。在这篇有关DDK的开发论文里。
和S5933比较起来,开发PLX9054比较不幸,可能是第一次开发PCI的缘故吧.因为,很多PCI的例子都是对S5933,就连微软出版的<Programming the Microsoft Wi ...
hdu4597 Play Game（DFS）
转载请注明出处:http://blog.csdn.net/u012860063 题目链接:http://acm.hdu.edu.cn/showproblem.php? pid=4597 题意 Alic ...
stm32之RCC
stm32时钟系统的意义: 1.电源的开关作用,达到低功耗效果: 2.调节时钟的速度: 对于每个外设,都要设置设置,stm32的时钟系统为了更低功耗: STM32时钟系统框图分析: 时钟源: 时钟是S ...
stm32之GPIO
stm32有5组GPIO口,GPIOA GPIOB GPIOC GPIOD GPIOE 每个GPIO端口有: 2个配置寄存器GPIOx_CRL, GPIOx_CRH(32位): 2个数据寄存器GPIO ...
[Swust OJ 1094]--中位数（巧用set，堆排序）
题目链接:http://acm.swust.edu.cn/problem/1094/ Time limit(ms): 1000 Memory limit(kb): 32768 中位数(又称中值,英 ...
chrome 浏览器帐号登录不来，如何解决自己的书签
装系统前把该目录下 C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default 的 Bookmarks 复制出 ...
QTableWidget的用法总结
在使用Qt不多的日子里,已经两次用到了QTableWidget这个控件,也慢慢的习惯和喜欢上了它.再使用QTableWidget的时候,已不像刚开始使用时的迷茫.嗯嗯.现在就来总结总结我与QTable ...
利用cmake来搭建开发环境
对于经常在终端下写程序的non-windows程序员,Makefile绝对是最常用的工具,小到一个文件的简单的测试程序,大到数百个文件的商业软件,只需要有shell,一个make命令就可得到可运行的程 ...
erlang 初体验
近期測试了一下 erlang的坑... 如不出意外.... 大家第一眼看到这语法... 心里第一句一定是"我擦.这TM都是啥!!!!!" 没有变量!!! 没有结构体!!! 没有循环 ...

listbox多选实现上下移动 js版和服务器版

listbox多选实现上下移动 js版和服务器版的更多相关文章

随机推荐

热门专题