简单listbox左右选择实例

最新推荐文章于 2020-12-05 11:29:33 发布
最新推荐文章于 2020-12-05 11:29:33 发布
阅读量491 收藏
点赞数
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kefeng824/article/details/38383459
版权 
<!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> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>listbox实例</title> 
<script>
	/*
		Auth：FattigerTao
		QQ:694871175
		Date:2014-08-05
<span style="white-space:pre">		</span>Company:FT胖虎工作室
<span style="white-space:pre">		</span>WebSit:http://home.zhubajie.com/7283462/info.html
<span style="white-space:pre">		转载注明出处</span>
	*/
	function moveRightAll(){
		var left = document.getElementById("left"); 
		var right = document.getElementById("right"); 
		for(i = 0; i < left.length; i ++ ) {
			var option = new Option(); 
			option.text = left[i].innerText; 
			right.add(option);
			left.options.remove(left[i--]);
		}
	}
	
	function moveRight(){
		var left = document.getElementById("left"); 
		var right = document.getElementById("right");
		for(var i = 0; i < left.length; i ++ ) { 
			if(left[i].selected == true) { 
				var option = new Option(); 
				option.text = left[i].innerText; 
				right.add(option);
			} 
		}
		for(var j = 0; j < left.length; j++){
            if(left[j].selected){
                left.remove(left.selectedIndex);
                j--;
            }
        }
	}


	function moveLeft(){ 
		var left = document.getElementById("left"); 
		var right = document.getElementById("right");
		for(var i = 0; i < right.length; i ++ ) { 
			if(right[i].selected == true) { 
				var option = new Option(); 
				option.text = right[i].innerText; 
				left.add(option);
			} 
		}
		for(var j = 0; j < right.length; j++){
            if(right[j].selected){
                right.remove(right.selectedIndex);
                j--;
            }
        }
	} 


	function moveLeftAll(){
		var left = document.getElementById("left"); 
		var right = document.getElementById("right"); 
		for(var i = 0; i < right.length; i++){ 
			var option = new Option(); 
			option.text = right[i].innerText; 
			left.add(option);
			right.options.remove(right[i--]);
		} 
	}
	</script> 
</head> 
<body> 
	<table width="80%" border="0" align="center" style="margin-top:80px;"> 
		<tr> 
			<td align="right"> 
				<select name="left" size="10" multiple="multiple" id="left" style="width:150px; font-size:20px"> 
					<option>北京</option> 
					<option>上海</option> 
					<option>广东</option> 
					<option>山东</option> 
					<option>江苏</option> 
					<option>浙江</option>
				</select> 
			</td> 
			<td align="center"> 
				<p> 
				<input type="button" name="moveRightAll" value=">>" οnclick="moveRightAll()" /> 
				</p> 
				<p> 
				<input type="button" name="moveRight" value=">" οnclick="moveRight()"/> 
				</p> 
				<p> 
				<input type="button" name="moveLeft" value="<" οnclick="moveLeft()"/> 
				</p> 
				<p> 
				<input type="button" name="moveLeftAll" value="<<" οnclick="moveLeftAll()"/> 
				</p> 
			</td> 
			<td> 
				<select name="right" size="10" multiple="multiple" id="right" style="width:150px; font-size:20px"> 
				</select> 
			</td> 
		</tr> 
	</table>
</body> 
</html>

FattigerTao
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
listbox实例
05-04
非常好用的列表控件，非常适合初学者使用。提供了详细的码源
一个ListBox的例子
weixin_33946605的博客
01-16 81
1.向ListBox中放入其他控件 XAML: &lt;Window x:Class="ItemsControls.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/...
listbox控件示例
todototry的专栏
10-31 2347
public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void CheckBox1_CheckedChanged(object sender, EventArgs e
ListBox的实例（5）
weixin_30888413的博客
05-28 94
实例一：显示省市 第一步：在MainWindow中托两个ListBox分别命名为lbProv和lbCity 第二步：为主窗体添加loaded事件，代码如下： 1 private void Window_Loaded(object sender, RoutedEventArgs e) 2 { 3 List<string> l...
C#ListBox简单应用例子
09-20
一个C#的ListBox简单应用例子。 实现在ListBox控件间进行数据交换。
ListBox实现上移,下移,左移,右移的简单实例
12-11
在这个实例中，我们看到如何使用JavaScript来实现ListBox中选项的动态移动，包括上移、下移、左移和右移的功能。这个功能常用于需要调整列表顺序或者在两个ListBox之间交换项目的场景。 首先，我们来看一下HTML部分...
silverlight访问WCF实例开发培训
01-29
完成以上步骤后，最终用户界面应呈现出左右布局，左侧的专业列表可通过点击选择，右侧则实时显示所选专业的学生信息。界面应包含各种操作按钮，如增、删、改、查，以及数据保存功能。 这个实例不仅涵盖了...
BootStrap实现手机端轮播图左右滑动事件
11-23
Bootstrap是一款流行的前端开发框架，它提供了丰富的样式和组件，使得构建响应式网页变得简单高效。在Bootstrap中，轮播组件（Carousel）是一个常见的用于展示图片或内容切换的元素，尤其适用于移动设备。然而，标准...
Visual C++程序开发范例宝典(光盘) 第八部分
04-25
实例051　利用ListBox控件实现标签式数据选择 实例052　在ListBox控件间实现数据交换 实例053　列表项的提示条 2.4　ComboBox控件典型实例 实例054　将数据表中的字段添加到ComboBox控件 实例055　带查询功能的...
C#窗体控件ListBox经典使用的例子 源码
06-26
C#窗体控件ListBox经典使用的例子 源码 京华志&精华志出品 希望大家互相学习，互相进步 支持CSDN 支持微软 主要包括C# ASP.NET SQLDBA 源码 毕业设计 开题报告 答辩PPT等
WindowFrom之ListBox实例
亿念之茶的专栏
05-21 437
这是实现课本上的一个例子 using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; n
jquery 操作listbox 左右相互选择
02-23 226
实现左右两个listbox的相互选择功能 代码如下: 1 function ListBox_Move(listfrom, listto) { 2 var size = $j("#" + listfrom + " option").size(); 3 var selsize = $j("#" + listfr...
Pysimple列表框listbox添加参数
weixin_46770425的博客
11-06 391
window.Element(’-LIST-’).Update(Sites_dict) 也就是更新
两个listbox选定左右增加选项
人生若只如初见.......
09-14 2449
<br />1，通过双击左边listbox选项增加到右边的listbox,经过测试,已经成功<br /> protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { if (!Page.IsStartupScriptRegistered("lstCarLeft")) { ListBox_DblClick("lstCarLeft", Page,
python listbox控件_C# ListBox：列表框控件
weixin_39968946的博客
12-05 315
列表框 (ListBox) 将所提供的内容以列表的形式显示出来，并可以选择其中的一项或多项内容，从形式上比使用复选框更好一些。例如，在 Word 中设置字体时界面如下图所示。在列表框控件中有一些属性与前面介绍的控件不同，如下表所示。属性名作用MultiColumn获取或设置列表框是否支持多列，如果设置为 True，则表示支持多列； 如果设置为 False，则表示不支持多列，默认为 FalseIte...
左右列表框内容选择控件
leishu_的博客
03-09 476
    左右列表框内容选择控件，是一个实际项目中经常要用到的一个控件。     在网上可以搜索到使用Mootools技术开发的M2MSelector控件，就是一个典型的实现。印象中，网上也有使用ExtJS技术实现的该类控件。可是，在网上搜不到使用jQuery技术实现的该类型的控件。就自己实现一个吧。     先看一下页面元素有哪些吧，附图如下：        该控件包含两个可多选的下...
列表框的左右上下移动
Java之道
06-22 3248
效果：HTML页面代码： js操作列表框 <!-- var ListUtil = new Object(); //全部移动 ListUtil.moveAll = function moveAll(oListboxFrom,oListboxTo){ var options = oListboxFro
vb-让listbox右击后先选中
两天打鱼三天晒网
12-29 1861
Option Explicit Private Declare Sub mouse_event Lib "user32" (ByVal dwFlags As Long, ByVal dx As Long, ByVal dy As Long, ByVal cButtons As Long, ByVal dwExtraInfo As Long) Private Const MOUSEEVENTF_LEFTDOWN = &H2 ' left button down Private Const MOUSEEV
c#实现listbox左右移动
最新发布
05-24
可以通过以下步骤实现 ListBox 左右移动： 1. 创建两个 ListBox 控件，并分别命名为 listBox1 和 listBox2。 2. 在 listBox1 中添加一些项。 3. 实现左右移动功能的代码如下： ```csharp // 将 listBox1 中选中的项移动到 listBox2 foreach (var item in listBox1.SelectedItems) { listBox2.Items.Add(item); listBox1.Items.Remove(item); } // 将 listBox2 中选中的项移动到 listBox1 foreach (var item in listBox2.SelectedItems) { listBox1.Items.Add(item); listBox2.Items.Remove(item); } ``` 4. 将左右移动的功能绑定到按钮的 Click 事件中： ```csharp private void btnLeft_Click(object sender, EventArgs e) { // 将 listBox2 中选中的项移动到 listBox1 foreach (var item in listBox2.SelectedItems) { listBox1.Items.Add(item); listBox2.Items.Remove(item); } } private void btnRight_Click(object sender, EventArgs e) { // 将 listBox1 中选中的项移动到 listBox2 foreach (var item in listBox1.SelectedItems) { listBox2.Items.Add(item); listBox1.Items.Remove(item); } } ``` 5. 运行程序，测试左右移动功能是否正常。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值