ListBox在客户端添加删除操作

zoukankan html css js c++ java

ListBox在客户端添加删除操作

<%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="WebExample.WebForm1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
    <HEAD>
        <title>WebForm1</title>
        <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
        <meta name="CODE_LANGUAGE" Content="C#">
        <meta name="vs_defaultClientScript" content="JavaScript">
        <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
        <script>
           function Add()
           {
             var elemAll = document.getElementById("lbAll");
             var elemSel = document.getElementById("lbSel");
             for(var i=0;i<elemAll.options.length;i++)
             {
                 if(elemAll.options[i].selected)
                 {
                     var SelText=elemAll.options[i].innerText;
                     var SelValue = elemAll.options[i].value;
                     var Num = elemSel.options.length;
                     elemSel.options[Num]=new Option(SelText,SelValue);
                     elemAll.options.remove(i);
                     i--;
                 }
             }
           }

           function Remove()
           {
              var elemAll = document.getElementById("lbAll");
             var elemSel = document.getElementById("lbSel");
             for(var i=0;i<elemSel.options.length;i++)
             {
                if(elemSel.options[i].selected)
                {
                    var SelText = elemSel.options[i].innerText;
                    var SelValue = elemSel.options[i].value;
                    var Num = elemAll.options.length;
                    elemAll.options[Num]= new Option(SelText,SelValue);
                    elemSel.options.remove(i);
                    i--;
                }
             }
           }
        </script>
    </HEAD>
    <body>
        <form id="Form1" method="post" runat="server">
            <TABLE>
                <TR>
                    <TD>
                        <asp:ListBox id="lbAll" runat="server" Width="100px" Height="150px" SelectionMode="Multiple"></asp:ListBox></TD>
                    <TD>
                        <INPUT id="btnAdd" type="button" value=">>" onclick="Add();"><br>
                        <INPUT id="btnRemove" type="button" value="<<" onclick="Remove();">
                    </TD>
                    <TD>
                        <asp:ListBox id="lbSel" runat="server" Width="100px" Height="150px" SelectionMode="Multiple"></asp:ListBox></TD>
                </TR>
            </TABLE>
        </form>
    </body>
</HTML>

查看全文

相关阅读:
查看linux命令类型
 理解bashrc和profile[转载]
问题：ldconfig
箭头函数
 闭包函数
 方法
 手把手教你使用百度地图（图解）
变量作用域与解构赋值
 iterable
Map和Set

原文地址：https://www.cnblogs.com/VirtualMJ/p/515396.html