OPTION 转移项目

最新推荐文章于 2026-01-06 02:26:14 发布

原创最新推荐文章于 2026-01-06 02:26:14 发布 · 819 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#button #function #class #input #stylesheet #list

JAVASCRIPT 专栏收录该内容

6 篇文章

订阅专栏

该博客展示了一个基于HTML和JavaScript实现的人员分配选择功能。通过多个JavaScript函数，实现了人员列表的添加、全部添加、删除、全部删除等操作，用户可从负责人员列表中选择人员添加到已选中列表，还能进行反向操作，最后可确定选择或取消。

<HTML>
<HEAD>
  <title>UserConfig</title>
  <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
  <meta name="CODE_LANGUAGE" Content="C#">
  <meta name="vs_defaultClientScript" content="JavaScript">
  <LINK href="../appCssStyle/css.css" type="text/css" rel="stylesheet">
  <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
  <script language="JavaScript">
//添加
function AddSelect(){
  destList = window.document.forms[0].SlectedListBox;
  srcList = window.document.forms[0].ListBoxList;
  var len = destList.length;
  for(var i = 0; i < srcList.length; i++) {
      if ((srcList.options[i] != null) && (srcList.options[i].selected)) {

}
}
function is_exist_option(list_obj,one_str)
{
var i,list_option_num;

  if (list_obj.options.length>0){
   list_option_num=list_obj.options.length;
   for (i=0;i<list_option_num;i++)
   {
    if (list_obj.options(i).value==one_str)
    return(true);
   }
  }
  return(false);
}
function AddChange(){
     AddSelect();
}
//确定
function OK(){
  if (!opener) return true;
  var i;
  var seloption;
  var sel_option;

var t_array = new Array();
var v_array = new Array();

  var obj = document.Form1.SlectedListBox;
  for (i=0;i<obj.options.length;i++){
   t_array[i] = obj.options(i).text;
   v_array[i] = obj.options(i).value;
  }

  opener.Set_SlistBoxOption(t_array,v_array);
  self.close();
  return false;
}

//删除选择的
function delselected() {
  var ListBoxObj = window.document.forms[0].SlectedListBox;
  var len = ListBoxObj.options.length;
  for(var i = (len-1); i >= 0; i--) {
   if ((ListBoxObj.options[i] != null) && (ListBoxObj.options[i].selected == true)) {
   ListBoxObj.options[i] = null;
  }
}
}

//全部删除
function delall(){
  for(var i=window.document.forms[0].SlectedListBox.options.length-1;i>=0;i--){

      window.document.forms[0].SlectedListBox.options[i] = null;
  }
}
//单击删除
function DelChange(){
   delselected();
}

  </script>
</HEAD>
<body MS_POSITIONING="GridLayout">
  <form name="Form1" method="post" action="UserConfig.aspx" id="Form1">
   <table class="bg1" cellSpacing="0" borderColorDark="#ffffff" cellPadding="0" width="500"
    align="center">
    <tr>
     <td height="26">
      <table cellSpacing="0" cellPadding="0" width="100%" border="0">
       <tr>
        <td width="1%"><IMG height="35" src="../img/im_0007.gif" width="35"></td>
        <td class="bg001" vAlign="middle" align="left"><font class="bt001">人员分配</font>
        </td>
       </tr>
      </table>
     </td>
    </tr>
    <tr>
     <td align="center"><br>
      <table lass="zi" cellSpacing="0" borderColorDark="#ffffff" cellPadding="0" width="450"
       align="center" borderColorLight="#909090" border="1">
       <tr valign="middle" bgcolor="#ebeae8">
        <td height="25" colspan="3" align="left"><strong> 选择负责人</strong></td>
       </tr>
       <tr>
        <td height="25" align="center" valign="middle" bgcolor="#6699cc"><strong><font color="#ffffff">负责人员列表</font></strong></td>
        <td width="70" rowspan="2" align="center" valign="middle" bgcolor="#fbfaf9">
         <P>
          <INPUT id="AddAll" type="button" value="全部添加" name="Add" class="cmd_but2" onclick="return AddA();">
         </P>
         <P>
          <INPUT id="Add" type="button" value="添加" name="Add" class="cmd_but2" onclick="return AddSelect();">
         </P>
         <P>
          <INPUT id="Del" type="button" value="删除" name="Del" class="cmd_but2" onclick="return delselected();">
         </P>
         <P>
          <INPUT id="DelAll" type="button" value="全部删除" name="DelAll" class="cmd_but2" onclick="return delall();">
          <BR>
         </P>
        </td>
        <td height="25" align="center" valign="middle" bgcolor="#6699cc"><strong><font color="#ffffff">
           已选中负责人员</font></strong></td>
       </tr>
       <tr>
        <td width="190" height="300" align="left" valign="top">
         <DIV id="plan2" style="OVERFLOW: auto; WIDTH: 190px; HEIGHT: 300px">
          <select name="ListBoxList" size="4" multiple="multiple" id="ListBoxList" ondblclick="AddChange()" style="height:296px;width:184px;">
<option value="b14d98ae-5f47-447e-9393-9bfdb2947016">admin</option>
<option value="d99b1806-4209-404f-bf6a-75d18eff37d6">test</option>
<option value="cdafd130-decf-4e9d-9316-cef74ecd3893">但工</option>
<option value="18e0715d-b740-4ce6-ad4f-b8252eb5c20d">zxy</option>
<option value="3274b0b7-db65-4d13-a701-c6bdaf141bbd">ly</option>
<option value="8a411cb0-01ed-4dc5-92d6-910c4f1e710f">郑良</option>
<option value="b49f065a-36c1-45ee-9e02-69cd410398df">夏建萍</option>
<option value="5c2050e5-3a7f-4c0c-92ba-177fe79a67ec">罗胜国</option>
<option value="8605666e-0554-483b-a30c-e4a954d30c85">刘文杰</option>
<option value="af99e1c6-00ea-4f80-9179-a24a8e0f9aa1">孙占来</option>
<option value="ba87092c-516b-41bd-b62a-875adbc04842">赵淑华</option>
<option value="6c8d655e-d5d0-49a8-a315-dd4c87e1d1b6">赵常顺</option>
<option value="ef539b44-8d95-460a-99fc-a8a35ae73dd3">张效朝</option>
<option value="ea3a6076-086a-4307-8dac-210728e7e6fe">柳原</option>
<option value="44f2c588-d21a-42b1-ab48-059e056bbd01">测试人员1</option>

</select>
         </DIV>
        </td>
        <td width="190" height="300" align="left" valign="top">
         <DIV id="plan" style="OVERFLOW: auto; WIDTH: 190px; HEIGHT: 300px">
          <SELECT size="18" id="SlectedListBox" name="SlectedListBox" type="select-multiple" style="WIDTH: 184px; HEIGHT: 296px"
           ondblclick="DelChange()" multiple>
          </SELECT>
         </DIV>
        </td>
       </tr>
       <tr bgcolor="#ebeae8">
        <td height="21" colspan="3" align="right" valign="top"><INPUT name="button" type="button" onclick="return OK();" value="确定" class="cmd_but2">
            <INPUT name="button" type="button" onclick="window.close()" value="取消" class="cmd_but2">
            </td>
       </tr>
      </table>
      <br>
     </td>
    </tr>
   </table>
  </form>
</body>
</HTML>