多选列表框动态添加,移动,删除,全选等操作的简单实例
<%
dim a
a = split(Request.Form("sourceList"),",")
Response.Write "Source:" & Request.Form("sourceList") & ubound(a) & "<br>Object:" & Request.Form("objectList") & "<br>"
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Untitled Document</title>
<STYLE type=text/css>
.bgsubleft {
BACKGROUND-POSITION: center bottom; BACKGROUND-IMAGE: url(images/bgleft.gif); BACKGROUND-REPEAT: repeat-x
}
.bgsubleftn {
BACKGROUND-POSITION: left bottom; BACKGROUND-IMAGE: url(images/bgleftn.gif); BACKGROUND-REPEAT: no-repeat
}
</STYLE>
<script language="JavaScript" type="text/JavaScript">
function addSelectedList()
{
var objSource = form1.sourceList;
var objObject = form1.objectList;
var sourcelen = objSource.length ;
for(var i=0;i<sourcelen;i++){
if (objSource.options[i].selected){
if (!checkExist(objObject,objSource.options[i].value)){
addtolist(objObject,objSource.options[i].text,objSource.options[i].value);
}
}
}
}
function addAllList()
{
var objSource = form1.sourceList;
var objObject = form1.objectList;
var sourcelen = objSource.length ;
for(var i=0;i<sourcelen;i++){
if (!checkExist(objObject,objSource.options[i].value)){
addtolist(objObject,objSource.options[i].text,objSource.options[i].value);
}
}
}
function removeSelectedList(noRemoveValue)
{
var objObject = form1.objectList;
for (var i=0;i<objObject.length;i++){
if (objObject.options[i].selected && objObject.options[i].value != noRemoveValue)
{
objObject.options.remove(i);
removeList(noRemoveValue);break;
}
}
}
function removeAllList(noRemoveValue)
{
var objObject = form1.objectList;
var objLen = objObject.length;
for (var i=0;i<objLen;i++){
if ( objObject.options[i].value != noRemoveValue){
objObject.options.remove(i);
removeAllList(noRemoveValue);break;
}
}
}
function selectedAll(obj)
{
for (var i=0;i<obj.length;i++){
obj.options[i].selected = true;
}
}
function checkExist(obj,value)
{
var isExist = false;
for (var i=0;i<obj.length;i++){
if (obj.options[i].value == value){
isExist = true;
break;
}
}
return isExist;
}
function addtolist(obj,value,label){
obj.add(new Option(value,label));
}
</script>
</head>
<body bgcolor="#FFFFFF">
<form name="form1" action="temp.asp" method="post">
<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><select name="sourceList" size="10" multiple id="sourceList" style="width:150">
<option value="a">1</option>
<option value="b">2</option>
<option value="c">3</option>
<%
for i = 6 to 20
Response.Write("<option value=""" & i+200 & """>" & i+200 & "</option>" & vbcrlf)
Next
%>
</select></td>
<td><input name="add" type="button" id="add" value="Add" onclick="addSelectedList()" style="width:100"><br>
<input name="add" type="button" id="add" value="Add all" onclick="addAllList()" style="width:100"><br>
<input name="add" type="button" id="add" value="Remove" onclick="removeSelectedList('a')" style="width:100"><br>
<input name="add" type="button" id="add" value="Remove all" onclick="removeAllList('a')" style="width:100">
<input name="add" type="button" id="add" value="Select all" onclick="selectedAll(form1.objectList)" style="width:100"></td>
<td><select name="objectList" size="10" multiple id="objectList" style="width:150">
<option value="a">1</option>
<option value="d">4</option>
<option value="e">5</option>
<%
for i = 6 to 20
Response.Write("<option value=""" & i & """>" & i & "</option>" & vbcrlf)
Next
%>
</select></td>
</tr>
<tr>
<td></td>
<td><input name="subm" type="submit" value="Submit" style="width:100"></td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>
相关文章
这篇文章主要为大家介绍了Leaflet数据可视化实现地图下钻示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-01-01
这篇文章主要针对微信jssdk用法进行汇总，通过ready接口处理成功验证、通过error接口处理失败验证等内容介绍，感兴趣的小伙伴们可以参考一下2016-07-07
Bootstrap每天必学之导航组件，制作面包屑式导航、导航加下拉菜单效果，感兴趣的小伙伴们可以参考一下2016-04-04
这篇文章主要为大家详细介绍了微信小程序自定义轮播图，swiper dots默认样式修改，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-11-11
建议大家看下JavaScript重要知识更新...2007-07-07
这篇文章主要介绍了小程序实现人脸识别功能(百度ai)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2018-12-12
这篇文章主要介绍了JS弹性运动实现方法,结合实例形式分析了JS实现弹性运动的原理、相关技术细节与实现技巧,需要的朋友可以参考下2016-12-12
这篇文章主要介绍了js实现表单项的全选、反选及删除操作,结合实例形式分析了基于dedecms后台使用js实现表单项的全选、反选及删除相关操作技巧,需要的朋友可以参考下2020-06-06
java必学必会之static关键字，static关键字是很多朋友在编写代码和阅读代码时碰到的比较难以理解的一个关键字，下面结合大家一起学习static关键字2015-12-12
因为对于内容的删除是件很重要的事，所以一般的系统中，都需要删除确认一下，以免误删，具体的方法如下，大家可以参考下。2009-12-12
最新评论