<!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=gb2312" />
<title>采购订单</title>
<script type="text/javascript">
function addRow(){
var tableObj = document.getElementById("test");
var rowLength = tableObj.rows.length;
var newTr = document.createElement("tr");
var newTd0 = document.createElement("td");
var newTd1 = document.createElement("td");
var newTd2 = document.createElement("td");
var newTd3 = document.createElement("td");
var newTd4 = document.createElement("td");
var newTd5 = document.createElement("td");
var newTd6 = document.createElement("td");
var newTd7 = document.createElement("td");
var newTd8 = document.createElement("td");
newTd0.innerHTML = "测试数据" +(rowLength-1);
newTd1.innerHTML = rowLength-2; //=select 的 indexselect
newTd2.innerHTML ="document.myform.goodsnumber.option.selected";
newTd3.innerHTML = "测试数据" +(rowLength-1);
newTd4.innerHTML = "测试数据" +(rowLength-1);
newTd5.innerHTML = "测试数据" +(rowLength-1);
newTd6.innerHTML = "测试数据" +(rowLength-1);
newTd7.innerHTML = "测试数据" +(rowLength-1);
newTd8.innerHTML = "测试数据" +(rowLength-1);
newTr.appendChild(newTd0);
newTr.appendChild(newTd1);
newTr.appendChild(newTd2);
newTr.appendChild(newTd3);
newTr.appendChild(newTd4);
newTr.appendChild(newTd5);
newTr.appendChild(newTd6);
newTr.appendChild(newTd7);
newTr.appendChild(newTd8); /*
var lastTr = tableObj.rows[rowLength+1];
lastTr.parentNode.insertBefore(newTr,lastTr);
*/
tableObj.appendChild(newTr);
}
//删除行
function deleteRow(){
var tableObj = document.getElementById("test");
var lastTrIndex = tableObj.rows.length - 1; //表格最后一行索引
if(lastTrIndex > 0){
tableObj.deleteRow(lastTrIndex);
}
}</script>
</head><body>
<form name="myform" method="post">
<table width="700" border="0" align="center" id="choice"> <tr>
<td width="100">
商品编号:
</td>
<td>
<select name="goodsnumber" style="width:80%">
<option value="">————请选择————</option>
<option value="xxsg01">xxsg01</option>
<option value="hgyl02">hgyl02</option>
<option value="gzrl03">gzrl03</option>
<option value="xmhx04">xmhx04</option>
<option value="gdtc05">gdtc05</option>
<option value="mwxc66">mwxc66</option>
<option value="skyy07">skyy07</option>
<option value="xxsc08">xxsc08</option>
<option value="xgbg09">xgbg09</option>
<option value="gzsp10">gzsp10</option>
</select>
</td>
<td width="100">
商品名称:
</td>
<td>
<select name="goodsname" style="width:80%">
<option value="">————请选择————</option>
<option value="">新鲜水果</option>
<option value="">火锅原料</option>
<option value="">各种肉类</option>
<option value="">鲜美海鲜</option>
<option value="">各地特产</option>
<option value="">美味小吃</option>
<option value="">爽口饮料</option>
<option value="">新鲜蔬菜</option>
<option value="">雪糕冰棍</option>
<option value="">罐装食品</option>
</select>
</td>
</tr>
<tr>
<td width="50">
货运方式:
</td>
<td>
<select name="sendway" style="width:80%">
<option value="">————请选择————</option>
<option value="">公路运输</option>
<option value="">铁路运输</option>
<option value="">航空运输</option>
</select>
</td>
<td width="100">
供应商:
</td>
<td>
<select name="provider" style="width:80%">
<option value="">————请选择————</option>
<option value="">当当网</option>
<option value="">亚马逊</option>
<option value="">淘宝</option>
<option value="">京东</option>
<option value="">食味网</option>
<option value="">聪慧网</option>
<option value="">3158采购网</option>
<option value="">奇异网</option>
</select>
</td>
</tr>
<tr>
<td width="100">
采购部门:
</td>
<td>
<select name="buyclass" style="width:80%">
<option value="">————请选择————</option>
<option value="">质量部门</option>
<option value="">财务部门</option>
<option value="">生产部门</option>
<option value="">仓库部门</option>
<option value="">管理部门</option>
<option value="">采购部门</option>
<option value="">销售部门</option>
</select>
</td>
<td width="100">
采购员:
</td>
<td>
<select name="client" style="width:80%">
<option value="">————请选择————</option>
<option value=""></option>
<option value="">/option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
</select>
</td>
</td>
</tr>
<tr>
<td width="100">
数 量:
</td>
<td><input type="text" name="adress" />
</td>
<td width="100">
收货地址:
</td>
<td><input type="text" name="adress" /></td>
</tr>
<tr height="20"></tr>
<tr align="center">
<td colspan="2"><input type="button" value="确定" onclick="addRow()"/> <input type="button" value="删除一行" onclick="deleteRow()"/></td> <tr height="40"></tr>
</table>
</form>
<table width="800" cellpadding="0" cellspacing="0" border="2" align="center" id="test" font-size:12px;text-align:center;">
<tr align="center"><font size="5"> <b>采购订单</b></font> </tr>
<tr><td colspan=5><font color="#FF0000">订单编号:</font></td>
<td colspan=5><font color="#FF0000">创建日期:</font></td>
</tr>
<tr align="center">
<th width="10"><input type="checkbox" value="全选"></th>
<th width="100">序号</th>
<th width="100">商品编号</th>
<th width="200">商品名称</th>
<th width="50">数量</th>
<th width="150">供应商</th>
<th width="150">采购部门</th>
<th width="100">货运方式</th>
<th width="100">收货地址</th>
<th width="100">采购员</th>
</tr>
</table>
</body>
</html>
javascriptselectoptiontable动态获取值
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>采购订单</title>
<script type="text/javascript">
function addRow(){
var tableObj = document.getElementById("test");
var rowLength = tableObj.rows.length;
var newTr = document.createElement("tr");
var newTd0 = document.createElement("td");
var newTd1 = document.createElement("td");
var newTd2 = document.createElement("td");
var newTd3 = document.createElement("td");
var newTd4 = document.createElement("td");
var newTd5 = document.createElement("td");
var newTd6 = document.createElement("td");
var newTd7 = document.createElement("td");
var newTd8 = document.createElement("td");
newTd0.innerHTML = "测试数据" +(rowLength-1);
newTd1.innerHTML = rowLength-2; //=select 的 indexselect
newTd2.innerHTML ="document.myform.goodsnumber.option.selected";
newTd3.innerHTML = "测试数据" +(rowLength-1);
newTd4.innerHTML = "测试数据" +(rowLength-1);
newTd5.innerHTML = "测试数据" +(rowLength-1);
newTd6.innerHTML = "测试数据" +(rowLength-1);
newTd7.innerHTML = "测试数据" +(rowLength-1);
newTd8.innerHTML = "测试数据" +(rowLength-1);
newTr.appendChild(newTd0);
newTr.appendChild(newTd1);
newTr.appendChild(newTd2);
newTr.appendChild(newTd3);
newTr.appendChild(newTd4);
newTr.appendChild(newTd5);
newTr.appendChild(newTd6);
newTr.appendChild(newTd7);
newTr.appendChild(newTd8); /*
var lastTr = tableObj.rows[rowLength+1];
lastTr.parentNode.insertBefore(newTr,lastTr);
*/
tableObj.appendChild(newTr);
}
//删除行
function deleteRow(){
var tableObj = document.getElementById("test");
var lastTrIndex = tableObj.rows.length - 1; //表格最后一行索引
if(lastTrIndex > 0){
tableObj.deleteRow(lastTrIndex);
}
}</script>
</head><body>
<form name="myform" method="post">
<table width="700" border="0" align="center" id="choice"> <tr>
<td width="100">
商品编号:
</td>
<td>
<select name="goodsnumber" style="width:80%">
<option value="">————请选择————</option>
<option value="xxsg01">xxsg01</option>
<option value="hgyl02">hgyl02</option>
<option value="gzrl03">gzrl03</option>
<option value="xmhx04">xmhx04</option>
<option value="gdtc05">gdtc05</option>
<option value="mwxc66">mwxc66</option>
<option value="skyy07">skyy07</option>
<option value="xxsc08">xxsc08</option>
<option value="xgbg09">xgbg09</option>
<option value="gzsp10">gzsp10</option>
</select>
</td>
<td width="100">
商品名称:
</td>
<td>
<select name="goodsname" style="width:80%">
<option value="">————请选择————</option>
<option value="">新鲜水果</option>
<option value="">火锅原料</option>
<option value="">各种肉类</option>
<option value="">鲜美海鲜</option>
<option value="">各地特产</option>
<option value="">美味小吃</option>
<option value="">爽口饮料</option>
<option value="">新鲜蔬菜</option>
<option value="">雪糕冰棍</option>
<option value="">罐装食品</option>
</select>
</td>
</tr>
<tr>
<td width="50">
货运方式:
</td>
<td>
<select name="sendway" style="width:80%">
<option value="">————请选择————</option>
<option value="">公路运输</option>
<option value="">铁路运输</option>
<option value="">航空运输</option>
</select>
</td>
<td width="100">
供应商:
</td>
<td>
<select name="provider" style="width:80%">
<option value="">————请选择————</option>
<option value="">当当网</option>
<option value="">亚马逊</option>
<option value="">淘宝</option>
<option value="">京东</option>
<option value="">食味网</option>
<option value="">聪慧网</option>
<option value="">3158采购网</option>
<option value="">奇异网</option>
</select>
</td>
</tr>
<tr>
<td width="100">
采购部门:
</td>
<td>
<select name="buyclass" style="width:80%">
<option value="">————请选择————</option>
<option value="">质量部门</option>
<option value="">财务部门</option>
<option value="">生产部门</option>
<option value="">仓库部门</option>
<option value="">管理部门</option>
<option value="">采购部门</option>
<option value="">销售部门</option>
</select>
</td>
<td width="100">
采购员:
</td>
<td>
<select name="client" style="width:80%">
<option value="">————请选择————</option>
<option value=""></option>
<option value="">/option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
</select>
</td>
</td>
</tr>
<tr>
<td width="100">
数 量:
</td>
<td><input type="text" name="adress" />
</td>
<td width="100">
收货地址:
</td>
<td><input type="text" name="adress" /></td>
</tr>
<tr height="20"></tr>
<tr align="center">
<td colspan="2"><input type="button" value="确定" onclick="addRow()"/> <input type="button" value="删除一行" onclick="deleteRow()"/></td> <tr height="40"></tr>
</table>
</form>
<table width="800" cellpadding="0" cellspacing="0" border="2" align="center" id="test" font-size:12px;text-align:center;">
<tr align="center"><font size="5"> <b>采购订单</b></font> </tr>
<tr><td colspan=5><font color="#FF0000">订单编号:</font></td>
<td colspan=5><font color="#FF0000">创建日期:</font></td>
</tr>
<tr align="center">
<th width="10"><input type="checkbox" value="全选"></th>
<th width="100">序号</th>
<th width="100">商品编号</th>
<th width="200">商品名称</th>
<th width="50">数量</th>
<th width="150">供应商</th>
<th width="150">采购部门</th>
<th width="100">货运方式</th>
<th width="100">收货地址</th>
<th width="100">采购员</th>
</tr>
</table>
</body>
</html>
javascriptselectoptiontable动态获取值
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>采购订单</title>
<script type="text/javascript">
var getSelectedOptionValue=function (selectObj){
//if(selectObj=='')
//return '';
selectObj=$$one(selectObj);
var selectedIndex=selectObj.selectedIndex;
if(selectedIndex>=0){
var selectOption=selectObj.options[selectedIndex];
return selectOption.text;
}
else {
return "";
}
};
var $$one=function(name22){
return document.getElementsByName(name22)[0];
};
var index2=1;
function addRow(){
var tableObj = document.getElementById("test");
var rowLength = tableObj.rows.length;
var newTr = document.createElement("tr");
var newTd0 = document.createElement("td");
var newTd1 = document.createElement("td");
var newTd2 = document.createElement("td");
var newTd3 = document.createElement("td");
var newTd4 = document.createElement("td");
var newTd5 = document.createElement("td");
var newTd6 = document.createElement("td");
var newTd7 = document.createElement("td");
var newTd8 = document.createElement("td");
var newTd9 = document.createElement("td");
newTd0.innerHTML = index2++;
newTd1.innerHTML = rowLength-2; //=select 的 indexselect
newTd2.innerHTML =getSelectedOptionValue("goodsnumber");
newTd3.innerHTML = getSelectedOptionValue("goodsname");
newTd4.innerHTML = $$one("number_sum").value;
newTd5.innerHTML = getSelectedOptionValue("provider");
newTd6.innerHTML =getSelectedOptionValue("buyclass");
newTd7.innerHTML = getSelectedOptionValue("sendway");
newTd8.innerHTML = $$one("address").value;
newTd9.innerHTML = getSelectedOptionValue("client");
newTr.appendChild(newTd0);
newTr.appendChild(newTd1);
newTr.appendChild(newTd2);
newTr.appendChild(newTd3);
newTr.appendChild(newTd4);
newTr.appendChild(newTd5);
newTr.appendChild(newTd6);
newTr.appendChild(newTd7);
newTr.appendChild(newTd8);
newTr.appendChild(newTd9); /*
var lastTr = tableObj.rows[rowLength+1];
lastTr.parentNode.insertBefore(newTr,lastTr);
*/
tableObj.appendChild(newTr);
}
//删除行
function deleteRow(){
var tableObj = document.getElementById("test");
var lastTrIndex = tableObj.rows.length - 1; //表格最后一行索引
if(lastTrIndex > 0){
tableObj.deleteRow(lastTrIndex);
}
}</script>
</head><body>
<form name="myform" method="post">
<table width="700" border="0" align="center" id="choice"> <tr>
<td width="100">
商品编号:
</td>
<td>
<select name="goodsnumber" style="width:80%">
<option value="">————请选择————</option>
<option value="xxsg01">xxsg01</option>
<option value="hgyl02">hgyl02</option>
<option value="gzrl03">gzrl03</option>
<option value="xmhx04">xmhx04</option>
<option value="gdtc05">gdtc05</option>
<option value="mwxc66">mwxc66</option>
<option value="skyy07">skyy07</option>
<option value="xxsc08">xxsc08</option>
<option value="xgbg09">xgbg09</option>
<option value="gzsp10">gzsp10</option>
</select>
</td>
<td width="100">
商品名称:
</td>
<td>
<select name="goodsname" style="width:80%">
<option value="">————请选择————</option>
<option value="">新鲜水果</option>
<option value="">火锅原料</option>
<option value="">各种肉类</option>
<option value="">鲜美海鲜</option>
<option value="">各地特产</option>
<option value="">美味小吃</option>
<option value="">爽口饮料</option>
<option value="">新鲜蔬菜</option>
<option value="">雪糕冰棍</option>
<option value="">罐装食品</option>
</select>
</td>
</tr>
<tr>
<td width="50">
货运方式:
</td>
<td>
<select name="sendway" style="width:80%">
<option value="">————请选择————</option>
<option value="">公路运输</option>
<option value="">铁路运输</option>
<option value="">航空运输</option>
</select>
</td>
<td width="100">
供应商:
</td>
<td>
<select name="provider" style="width:80%">
<option value="">————请选择————</option>
<option value="">当当网</option>
<option value="">亚马逊</option>
<option value="">淘宝</option>
<option value="">京东</option>
<option value="">食味网</option>
<option value="">聪慧网</option>
<option value="">3158采购网</option>
<option value="">奇异网</option>
</select>
</td>
</tr>
<tr>
<td width="100">
采购部门:
</td>
<td>
<select name="buyclass" style="width:80%">
<option value="">————请选择————</option>
<option value="">质量部门</option>
<option value="">财务部门</option>
<option value="">生产部门</option>
<option value="">仓库部门</option>
<option value="">管理部门</option>
<option value="">采购部门</option>
<option value="">销售部门</option>
</select>
</td>
<td width="100">
采购员:
</td>
<td>
<select name="client" style="width:80%">
<option value="">————请选择————</option>
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
<option value="d">d</option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
</select>
</td>
</td>
</tr>
<tr>
<td width="100">
数 量:
</td>
<td><input type="text" name="number_sum" />
</td>
<td width="100">
收货地址:
</td>
<td><input type="text" name="address" /></td>
</tr>
<tr height="20"></tr>
<tr align="center">
<td colspan="2"><input type="button" value="确定" onclick="addRow()"/> <input type="button" value="删除一行" onclick="deleteRow()"/></td> <tr height="40"></tr>
</table>
</form>
<table width="800" cellpadding="0" cellspacing="0" border="2" align="center" id="test" font-size:12px;text-align:center;">
<tr align="center"><font size="5"> <b>采购订单</b></font> </tr>
<tr><td colspan=5><font color="#FF0000">订单编号:</font></td>
<td colspan=5><font color="#FF0000">创建日期:</font></td>
</tr>
<tr align="center">
<th width="10"><input type="checkbox" value="全选"></th>
<th width="100">序号</th>
<th width="100">商品编号</th>
<th width="200">商品名称</th>
<th width="50">数量</th>
<th width="150">供应商</th>
<th width="150">采购部门</th>
<th width="100">货运方式</th>
<th width="100">收货地址</th>
<th width="100">采购员</th>
</tr>
</table>
</body>
</html>