可否详细一点kingdomzhf(旭日东升) ( ) 我的代码如下
<html>
<head>
</head>
<body onload="doload()">
<form name ="test">
<select  name="zong" onchange="change()">
</select>
<select name="detail" MULTIPLE >
</select>
<input type="button" onclick="AddItem()" value=">>">
<input type="button" value="<<" onclick="DeleteItem()">
<input type="button" value="gettt" onclick="gettt()">
<select name ="get" MULTIPLE >
</select>
<div id="back"></div>
</form>
</boby>
</html>
<script>
function doload(){
        
        for (i=0;i<po_ca_show.length;i++) {         
             NewOptionName = new Option(po_ca_show[i], po_ca_value[i]);
             test.elements["zong"].options[i] = NewOptionName;
        }

for(j = 0; j < po_detail_value[0].length; j++){
             NewOptionName = new Option(po_detail_show[0][j], po_detail_value[0][j]);
 test.elements["detail"].options[j] = NewOptionName;  
        }
}
function change(){
m = document.test.elements["zong"].selectedIndex;
n = document.test.elements["detail"].length;

for(i=n-1;i>=0;i--)
        document.test.elements["detail"].options[i] = null;

for(j=0;j<po_detail_value[m].length;j++){
       NewOptionName=new Option(po_detail_show[m][j], po_detail_value[m][j]);
       test.elements["detail"].options[j] = NewOptionName;
}
}
function AddItem()
{
m = document.test.elements["zong"].selectedIndex;
n=document.test.elements["detail"].options.selectedIndex;
if(n==-1){
alert("请选择");
return;
}
l=document.test.elements["get"].length;
c=0;

    for(i=0;i<l;i++){
if(test.elements["get"].options[i].value == po_detail_value[m][n])
c=1;
}
if(c==0){
NewOptionName = new Option(po_detail_show[m][n], po_detail_value[m][n]);
test.elements["get"].options[l] = NewOptionName; 

var inner =back.innerHTML ; 
inner= inner +"<tr id='"+document.test.elements["get"].options[l].value+"'><td>";
inner = inner+"<input type='hidden' name ='code' value='"+document.test.elements["get"].options[l].value+"'>";
inner = inner +"<input type='hidden' name ='name' value='"+document.test.elements["get"].options[l].text+"'>";
inner = inner +" "+document.test.elements["get"].options[l].text +"</td>";
inner = inner +"<td><input type='text' name ='let'></td>";
inner = inner +"<td><input type='text' name ='unit'></td>";
inner = inner +"<td><input type='text' name ='total'></td>";
inner = inner +"</tr>";
back.innerHTML =inner; } if(n<document.test.elements["detail"].length-1){
document.test.elements["detail"].options[n].selected=false;
document.test.elements["detail"].options[n+1].selected=true;
}
}function DeleteItem()
{
  i=window.test.elements["get"].length;
  if(i>0)
  //m = document.test.elements["get"].selectedIndex;
  //if(m==-1){
// alert("请选择");
// return;
 // }
 // window.test.elements["get"].options[m] = null;
     window.test.elements["get"].options[i-1].value.deleteRow()
 window.test.elements["get"].options[i-1] = null;
//i=window.test.elements["get"].length;
//  if(i>0)
//    window.test.elements["get"].options[0].selected=true;
}function xianshi(){
 y=window.test.elements["get"].length-1;
 var inner =back.innerHTML ;
 //for(i=0;i<y;i++){
inner= inner+"<tr>";
inner= inner +"<td><input type='hidden' name ='code' value='"+document.test.elements["get"].options[y].value+"'>";
inner = inner +"<input type='hidden' name ='name' value='"+document.test.elements["get"].options[y].text+"'>";
inner = inner +" "+document.test.elements["get"].options[y].text +"</td>";
inner = inner +"<td><input type='text' name ='let'></td>";
inner = inner +"<td><input type='text' name ='unit'></td>";
inner = inner +"<td><input type='text' name ='total'></td>";
inner = inner +"</tr>";
//}
back.innerHTML =inner;
}
function gettt(){
alert(back.innerHTML);
}
</script>
<script>
  var po_ca_show = new Array();
  var po_ca_value = new Array();
  var po_detail_show = new Array();
  var po_detail_value = new Array();
  var funtype1;po_ca_show[0]='计算机/互联网/通讯';
po_ca_value[0]='0100';
po_detail_show[0]=new Array();
po_detail_value[0]=new Array();
po_detail_show[0][0]='(全部)计算机/互联网/通讯类';
po_detail_value[0][0]='0100';
po_detail_show[0][1]='首席技术执行官';
po_detail_value[0][1]='0101';
po_detail_show[0][2]='技术总监/经理';
po_detail_value[0][2]='0102';
po_ca_show[1]='销售';
po_ca_value[1]='0200';
po_detail_show[1]=new Array();
po_detail_value[1]=new Array();
po_detail_show[1][0]='(全部)销售类';
po_detail_value[1][0]='0200';
po_detail_show[1][1]='销售总监';
po_detail_value[1][1]='0201';
po_detail_show[1][2]='销售经理';
po_detail_value[1][2]='0202';
po_ca_show[2]='市场/公关/广告';
po_ca_value[2]='0300';
po_detail_show[2]=new Array();
po_detail_value[2]=new Array();
po_detail_show[2][0]='(全部)市场/公关/广告类';
po_detail_value[2][0]='0300';
po_detail_show[2][1]='市场/广告总监';
po_detail_value[2][1]='0301';
po_detail_show[2][2]='市场/营销经理';
po_detail_value[2][2]='0302';
</script>

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <!-- saved from url=(0065)http://msdn.microsoft.com/library/en-us/dndude/html/tableedit.asp -->
    <HTML><HEAD><TITLE>Sample</TITLE>
    <META http-equiv=Content-Type content="text/html; charset=gb2312">
    <STYLE>TR {
    FONT-WEIGHT: bold; FONT-SIZE: 20px; COLOR: black; FONT-FAMILY: verdana; BACKGROUND-COLOR: white
    }
    </STYLE>
    <xml>
    <MSHelp:Keyword Index="A" Term="tableedit"/>
    </xml><!-- TOOLBAR_START --><!-- TOOLBAR_EXEMPT --><!-- TOOLBAR_END -->
    <META content="MSHTML 6.00.2600.0" name=GENERATOR></HEAD>
    <BODY style="FONT-FAMILY: verdana">
    <H2>Table Editor</H2><BR>
    <H3>Single click to select a cell, alt-click to select a row</H3><BR>
    <DIV id=TableContainer>
    <TABLE id=TheTable style="TABLE-LAYOUT: fixed; BORDER-COLLAPSE: collapse" 
    border=1>
      <TBODY>
      <TR>
        <TD>Cell 1,1</TD>
        <TD>Cell 1,2</TD>
        <TD>Cell 1,3</TD></TR>
      <TR>
        <TD>Cell 2,1</TD>
        <TD>Cell 2,2</TD>
        <TD>Cell 2,3</TD></TR>
      <TR>
        <TD>Cell 3,1</TD>
        <TD>Cell 3,2</TD>
        <TD>Cell 3,3</TD></TR></TBODY></TABLE></DIV><BR><BR><BR><INPUT id=ButtonAddRow style="WIDTH: 200px" onclick=addRow() type=button value="Add Row"><BR><INPUT id=ButtonRemoveRow style="WIDTH: 200px" onclick=removeRow() type=button value="Remove Row"><BR><INPUT id=ButtonAddCell style="WIDTH: 200px" onclick=addCell() type=button value="Add Cell"><BR><INPUT id=ButtonRemoveCell style="WIDTH: 200px" onclick=removeCell() type=button value="Remove Cell"><BR><INPUT id=ButtonMoveUp style="WIDTH: 200px" onclick=moveUp() type=button value="Move Up"><BR><INPUT id=ButtonMoveDown style="WIDTH: 200px" onclick=moveDown() type=button value="Move Down"><BR><INPUT id=ButtonMoveLeft style="WIDTH: 200px" onclick=moveLeft() type=button value="Move Left"><BR><INPUT id=ButtonMoveRight style="WIDTH: 200px" onclick=moveRight() type=button value="Move Right"><BR><INPUT id=ButtonEditContents style="WIDTH: 200px" onclick=editContents(); type=button value="Edit Contents"> 
    <INPUT id=EditCell style="DISPLAY: none; WIDTH: 400px"><BR><INPUT id=ButtonEditStyle style="WIDTH: 200px" onclick=editStyle(); type=button value="Edit Table Style"> 
    <INPUT id=EditStyle style="DISPLAY: none; WIDTH: 400px"><BR>
      

  2.   

    <SCRIPT>
    var lastSelection = null;ButtonAddRow.setExpression("disabled", "nothingSelected(lastSelection)");
    ButtonRemoveRow.setExpression("disabled", "! rowSelected(lastSelection)");
    ButtonAddCell.setExpression("disabled", "nothingSelected(lastSelection)");
    ButtonRemoveCell.setExpression("disabled", "! cellSelected(lastSelection)");
    ButtonMoveUp.setExpression("disabled", "! rowSelected(lastSelection)");
    ButtonMoveDown.setExpression("disabled", "! rowSelected(lastSelection)");
    ButtonMoveLeft.setExpression("disabled", "! cellSelected(lastSelection)");
    ButtonMoveRight.setExpression("disabled", "! cellSelected(lastSelection)");
    ButtonEditContents.setExpression("disabled", "(! cellSelected(lastSelection)) || (EditCell.style.display == '')");
    ButtonEditStyle.setExpression("disabled", "(EditStyle.style.display == '')");
    ButtonEditStyle.setExpression("value", "'Edit ' + whatIsSelected(lastSelection) + ' Style'");function select(element) {
      var e, r, c;
      if (element == null) {
        e = window.event.srcElement;
      } else {
        e = element;
      }
      if ((window.event.altKey) || (e.tagName == "TR")) {
        r = findRow(e);
        if (r != null) {
          if (lastSelection != null) {
            deselectRowOrCell(lastSelection);
          }
          selectRowOrCell(r);
          lastSelection = r;
        }
      } else {
        c = findCell(e);
        if (c != null) {
          if (lastSelection != null) {
            deselectRowOrCell(lastSelection);
          }
          selectRowOrCell(c);
          lastSelection = c;
        }
      }  window.event.cancelBubble = true;
    } TableContainer.onclick = select;function cancelSelect() {  if (window.event.srcElement.tagName != "BODY") 
        return;  if (lastSelection != null) {
        deselectRowOrCell(lastSelection);
        lastSelection = null;
      }
    }document.onclick = cancelSelect;function findRow(e) {
      if (e.tagName == "TR") {
        return e;
      } else if (e.tagName == "BODY") {
        return null;
      } else {
        return findRow(e.parentElement);
      }
    }function findCell(e) {
      if (e.tagName == "TD") {
        return e;
      } else if (e.tagName == "BODY") {
        return null;
      } else {
        return findCell(e.parentElement);
      }
    }function deselectRowOrCell(r) {
      r.runtimeStyle.backgroundColor = "";
      r.runtimeStyle.color = "";
      //r.runtimeStyle.fontFamily = "Verdana";
    }function selectRowOrCell(r) {
      r.runtimeStyle.backgroundColor = "darkblue";
      r.runtimeStyle.color = "white";
      //r.runtimeStyle.fontFamily = "Verdana";
    }function addRow() {
      var r, p, nr;
      if (lastSelection == null) {
        r = null;
        p = TheTable.children[0];
      } else {
        r = lastSelection;    if (r.tagName == "TD") {
          r = r.parentElement;
        }    p = r.parentElement;
      }  nr = document.createElement("TR");  p.insertBefore(nr, r);  select(nr);  addCell();  return nr;    
    }function removeRow() {
      var r, p, nr;
      if (lastSelection == null)
        return false;  r = lastSelection;  if (r.tagName == "TD") {
        r = r.parentElement;
      }  p = r.parentElement;  p.removeChild(r);  lastSelection = null;
     
      return r; 
    }function addCell() {
      var r, p, c, nc, text;
      if (lastSelection == null)
        return false;  r = lastSelection;  if (r.tagName == "TD") {
        r = r.parentElement;
        c = lastSelection;
      } else {
        c = null;
      }  nc = document.createElement("TD");
      text = document.createTextNode("New Cell");  nc.insertBefore(text, null);
      r.insertBefore(nc, c);  select(nc);  return nc;
    }function removeCell() {
      var c, p, nr;
      if (lastSelection == null)
        return false;  c = lastSelection;  if (c.tagName != "TD") {
        return null;
      }  p = c.parentElement;  p.removeChild(c);  lastSelection = null;
     
      return c; 
    }function editContents() {
      var c, p, nr;
      if (lastSelection == null)
        return false;  c = lastSelection;  if (c.tagName != "TD") {
        return null;
      }  EditCell.style.display = "";  EditCell.value = c.innerHTML;  c.setExpression("innerHTML", "EditCell.value");  EditCell.focus();  EditCell.onblur = unhookContentsExpression;
    }function unhookContentsExpression() {
      lastSelection.removeExpression("innerHTML");
      EditCell.value = '';
      EditCell.style.display = "none";
    }function editStyle() {
      var c;  if (lastSelection == null) {
        c = TheTable;
      } else {
        c = lastSelection;
      }
      
      EditStyle.style.display = "";  EditStyle.value = c.style.cssText;  c.style.setExpression("cssText", "EditStyle.value");  EditStyle.focus();  EditStyle.onblur = unhookStyleExpression;
    }function unhookStyleExpression() {
      var c;  if (lastSelection == null) {
        c = TheTable;
      } else {
        c = lastSelection;
      }
      c.style.removeExpression("cssText");  EditStyle.value = '';
      EditStyle.style.display = "none";
    }function moveUp() {
      var r, p, ls;
      if (lastSelection == null)
        return false;  r = lastSelection;  if (r.tagName != "TR") {
        return null;
      }  if (r.rowIndex == 0) 
        return;  ls = r.previousSibling;  p = ls.parentElement;  p.insertBefore(r, ls);  return r;
    }function moveDown() {
      var r, p, ls;
      if (lastSelection == null)
        return false;  r = lastSelection;  if (r.tagName != "TR") {
        return null;
      }  ls = r.nextSibling;  if (ls == null)
        return null;  p = ls.parentElement;  ls = ls.nextSibling;  p.insertBefore(r, ls);  return r;
    }function moveLeft() {
      var c, p, ls;
      if (lastSelection == null)
        return false;  c = lastSelection;  if (c.tagName != "TD") {
        return null;
      }  ls = c.previousSibling;  if (ls == null)
        return null;  p = ls.parentElement;  p.insertBefore(c, ls);  return c;
    }function moveRight() {
      var c, p, ls;
      if (lastSelection == null)
        return false;  c = lastSelection;  if (c.tagName != "TD") {
        return null;
      }  ls = c.nextSibling;  if (ls == null)
        return null;  p = ls.parentElement;  ls = ls.nextSibling;  p.insertBefore(c, ls);  return c;
    }function nothingSelected() {
      return (lastSelection == null);
    }function rowSelected() {
      var c;
      if (lastSelection == null)
        return false;  c = lastSelection;  return (c.tagName == "TR")
    }function cellSelected() {
      var c;
      if (lastSelection == null)
        return false;  c = lastSelection;  return (c.tagName == "TD")
    }function whatIsSelected() {
      if (lastSelection == null) 
        return "Table";
      if (lastSelection.tagName == "TD") 
        return "Cell";
      if (lastSelection.tagName == "TR")
        return "Row";
    }</SCRIPT>