文档章节

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

深圳大道
 深圳大道
发布于 2016/12/29 15:24
字数 471
阅读 3
收藏 0
<%@ 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;
    }
}

本文转载自:http://blog.csdn.net/smartsmile2012/article/details/11479955

深圳大道
粉丝 3
博文 877
码字总数 0
作品 0
深圳
架构师
私信 提问
分享几个令人震撼的JS和HTML5游戏

或许你对网页游戏仅仅停留在Flash的时代,认为只有Flash才能做出非常绚丽的游戏特效。那么今天就打破大家的这个观念,一起来看看用Javascript和HTML5实现的网页游戏,这些游戏个人认为做得已...

tp_wire
2012/06/27
23.7K
20
JavaScript 到底有多慢?

拜浏览器大战所赐,主流浏览器的 JS 引擎已经引入了各种优化技术,不时出现的某某浏览器性能大幅提升的新闻也让前端同学们信心倍增。那么 JS 这门语言本身是否已经达到了接近原生的水平呢? ...

doodlewind
2018/10/29
0
0
谷歌 Firebase Cloud Messaging 对多浏览器开放

近日,Google表示,正在将Firebase Cloud Messaging的Web支持扩展到Chrome以外的其他Web浏览器,包括Firefox和Opera。此举,由一个新的JavaScript库启用,将允许开发人员通过浏览器将推送通知...

王练
2016/11/01
2.2K
3
统治 Web 的 JavaScript 准备要接管桌面了

编者按:曾 几何时,通信网络曾经活跃过许多协议,那些协议在不同的场景下都有各自的优势。但是后来 TCP/IP 随着互联网的崛起而异军突起,最终形成一统天下的格局。而原本被视为不入流的 We...

oschina
2016/05/15
10.8K
48
JavaScript 开发者的 10 款必备工具

JavaScript,一种所有主流浏览器都支持的语言,是开发基于浏览器的 Web 应用程序的主力,几乎每年都会受到来自众多开发人员的关注。自然地,框架和库的生态系统自然而然地围绕着 JavaScript...

oschina
2017/10/19
1K
0

没有更多内容

加载失败,请刷新页面

加载更多

Qt编写数据可视化大屏界面电子看板9-曲线效果

一、前言 为了编写数据可视化大屏界面电子看板系统,为了能够兼容Qt4和嵌入式linux系统,尤其是那种主频很低的,但是老板又需要在这种硬件上(比如树莓派、香橙派、全志H3、imx6)展示这么华...

飞扬青云
21分钟前
1
0
责任链模式

//这篇博客的博主真的不错,解析的都很清晰明了, https://blog.csdn.net/jason0539/article/details/45091639

南桥北木
47分钟前
3
0
Flutter -------- dio网络请求

dio是Flutter中文网开源的一个强大的Dart Http请求库,支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时等... 1.添加依赖# dependencies: dio: 2.1.x #...

切切歆语
57分钟前
1
0
PHP的学习

PHP变量的命名必须以$符开始,如: $i;$j;$name; $符后面的第一个字符不可以是数字,只能是字母或者下划线(_)。 除了下划线(_)之外,变量中不能出现任何特殊字符,也就是变量只能包含...

墨冥
今天
3
0
一篇文章彻底搞懂Java虚拟机

概念: 虚拟机:指以软件的方式模拟具有完整硬件系统功能、运行在一个完全隔离环境中的完整计算机系统 ,是物理机的软件实现。常用的虚拟机有VMWare,Visual Box,Java Virtual Machine(Jav...

骚年锦时
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部