注册 登录
编程论坛 → ASP技术论坛

列表内容如何移动问题

xiaocainiaol 发布于 2009-08-19 16:58， 457 次点击
我想实现的功能是：当点击》按钮时，左边列表中被选中的字段移到右边列表中；当点击《按钮时，右边列表中被选中的字段移到左边列表中。由于我对javascript不熟，总是不能实现我想要的效果。现在是：当我选中左边列表中某些字段并点击》按钮时，被选中的字段会被删除但在右边列表显示若干个“a1(i)” 而不是被选中的内容；当我选中右边列表中某些字段并点击《按钮时，被选中的字段会被删除但在左边列表中没有添加。请各位高手帮我看看下面代码如何修改。谢谢！
<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>
<%
z=10
if IsEmpty(a2) then
    redim a2(z)
    for i=0 to z
         a2(i)="      "
    next
End If
y=6
if IsEmpty(a1) then
    redim a1(y)
    for i=0 to y
       a1(i)=cstr(i)
    next
End If
%>
<script language="javascript">
function submitfz()   
{
   for (var i=0; i<fzform.fz.length; i++) {   
   if (fzform.fz.options[i].value=" ") {
       document.fzform.fz.options[i]=null;       
    }
  }
   for (var j=0; j<fzform.fzxz.length; j++) {   
     if (fzform.fzxz.options[j].selected) {
        var op=new Option(fzform.fzxz.options[j].value);
        document.fzform.fz.options.add(op);
       document.fzform.fzxz.options[j]=null
    }
  }
}
function resetfz()   
{
 for (var j=0; j<fzform.fz.length; j++) {   
   if (fzform.fz.options[j].selected) {
       var op=new Option(fzform.fz.options[j].value);
        document.fzform.fzxz.options.add(op);
       document.fzform.fz.options[j]=null;       
    }
  }
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
<html xmlns="http://www.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>学生基本情况统计分析</title>
<style type="text/css">
<!--
.STYLE1 {
    font-family: "隶书";
    font-size: large;
    color: #009999;
}
.STYLE2 {font-size: small}
-->
</style>
</head>

<body>

  <table width="50%" border="1" cellspacing="0" cellpadding="0">
    <caption>
      <span class="STYLE1">字段选择      </span>
    </caption>
    <tr>
      <td width="33%" align="center" class="STYLE2">分组（按住Shift键或Ctrl键可多选）</td>      
    </tr>
    <tr>
      <td><form id="fzform" name="fzform" method="post" action="">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
      <td align="center" class="STYLE2">可选字段：</td>
      <td align="center">&nbsp;</td>
      <td align="center" class="STYLE2">已选字段：</td>
      </tr>
        <tr>
          <td width="38%"  rowspan="2" align="right" valign="middle"><select name="fzxz" size="15" multiple="multiple" id="fzxz">
             <%for i=0 to y%>
            <option value="a1(i)"><%=a1(i)%></option>
             <%next%>
          </select></td>
          <td width="28%"  align="center" valign="middle"><input type="button" name="sfz" value="  &gt;  "onClick="submitfz()"/>
           </td>
          <td width="34%" rowspan="2" align="left" valign="middle"><select name="fz" size="15" multiple="multiple" id="fz">
          <%for i=0 to z%>
          <option value="a2(i)"><%=a2(i)%></option>
          <%next%>
          </select></td>
        </tr>
        <tr>
          <td align="center" valign="middle"><input type="button" name="rfz" value="  &lt;  " onClick="resetfz()"/>          </td>
        </tr>
      </table>
      </form></td>   
  </table>

</body>
3 回复
#2
yms1232009-08-19 20:02
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">
//添加单个选项代码
//参数为select列表框的名称或id
function AddOption(selA,selB)
{
   if(selA.selectedIndex<0)
      return false;
   var selOpt=selA.options[selA.selectedIndex];
   if(!IsHavaItem(selOpt,selB))
      selB.add(new Option(selOpt.text,selOpt.value));
   selA.remove(selA.selectedIndex);
}
//判断选项是否存在(防止重复添加)
function IsHavaItem(lItem,selB)
{
   for(var i=0;i<selB.options.length;i++)
   {
      if(lItem.value==selB.options[i].value&&lItem.text==selB.options[i].text)
         return true;
   }
   return false;
}
//添加所有选项代码
//参数为select列表框的名称或id
function AddAllOption(selA,selB)
{
   for(var i=0;i<selA.options.length;i++)
   {
       var lItem=selA.options[i];
       if(!IsHavaItem(lItem,selB))
           selB.add(new Option(lItem.text,lItem.value));
   }
   selA.options.length=0;
}
</script>
</head>
 
<body>
<form name="form1">
<table width="406" border="0" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
    <td width="183" height="201" valign="center"><div align="center">
      <select style="width:100px; " name="sel1" size="11">
        <option>abc</option>
        <option>def</option>
        <option>rty</option>
      </select>
    </div></td>
    <td width="65" valign="center"><div align="center">
      <p>
        <input type="button" name="Add" onClick="AddOption(document.form1.sel1,document.form1.sel2);" value=">">
  </p>
      <p>
        <input type="button" name="Remove" onClick="AddOption(document.form1.sel2,document.form1.sel1);" value="<">
</p>
      <p>
        <input type="button" name="AddAll" onClick="AddAllOption(document.form1.sel1,document.form1.sel2);" value=">>">
</p>
      <p>
        <input type="button" name="RemoveAll" onClick="AddAllOption(document.form1.sel2,document.form1.sel1);" value="<<">
</p>
    </div></td>
    <td width="158" valign="center"><div align="center">
      <select style="width:100px; " name="sel2" size="11">
        <option>fff</option>
        <option>ggg</option>
        <option>hhh</option>
        </select>
    </div></td>
  </tr>
</table>
</form>
</body>
</html>
以前写的例子
#3
xiaocainiaol2009-08-20 11:22
非常感谢yms123高手的帮助！！！另外，还想向版主请教一个问题：aspx页面的session能够传到asp页面中吗？我试了一下，好像不行，不知是否接收方法不对。我本来用.net已经做好了字段选择的页面，就是无法将选择结果传送到asp页面中,所以只好又退回来用asp来做字段选择的页面。
#4
yms1232009-08-20 12:00
以下是引用xiaocainiaol在2009-8-20 11:22的发言：非常感谢yms123高手的帮助！！！另外，还想向版主请教一个问题：aspx页面的session能够传到asp页面中吗？我试了一下，好像不行，不知是否接收方法不对。我本来用.net已经做好了字段选择的页面，就是无法将选择结果传 ...
aspx的Session不能直接传到ASP页面因为这两个Session是不通用的。
1
©2025, BC-CN.NET
电脑版