select下拉框美化加js运态添加删除表格单元格综合使用_bangbangnt的空间

好久没有来空间了，最近一段时间比较忙，在忙一个项目，现将本人正在做的一个项目中的DEMO的JS{tx}帖出来，以备以后再次使用，方便查看，也给需要此效果的朋友们一些帮助。

哎，现在都改行了，不写JAVA了，改做美工了。

先发个效果图出来：将select下拉框给xx美化掉，不管是使用什么操作系统，就是使用WINDOWS 98，显示也是这个效果，另外还有本人写的动态新增和删除表格单元格的代码，呵呵，本人JS不咋样，这个还是刚刚学会的。

完整代码：

Select下拉框美化JS下载地址：

此JS是由站点提供，上面这个包里面有很不错的JS{tx}，我这个里面使用的就是里面的dhtmlxCombo组件，相当不错

另外那个时间控件在站点上面可进行下载，不过需要说明的是，这个里面的中文包编码好像有点问题，如果换成它里面的中文包，需要自己手工将编码重新改一下才行，我的已经自己手工改了，没有任何问题。

在这里面有几个JS和CSS是我自己写的，click.js，setdhtmlxcombo.js，public.js，public.css都是我自己写的。

引用dhtmlxCombo方式自己稍微做了点小改动，原理和原来的是一样的，只是将一些可以放到JS文件里的代码全都放到JS文件里去了。

注意：此代码直接复制粘贴是不可行的，因为里面还包含了很多其它基本文件，此页面代码只是提供如何使用现成一些JS的方法的介绍。要想运行此页面的代码，需要去下载以上站点的文件再结合本示例才行。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>发货计划添加</title>
<link type="text/css" rel="stylesheet" href="../../../css/public.css" />
<link type="text/css" rel="stylesheet" href="../../../common/calendar/calendar-green.css" />
<link type="text/css" rel="stylesheet" href="../../../common/dhtmlx/dhtmlxCombo/dhtmlxcombo.css" />
<script type="text/javascript" src="../../common/calendar/calendar.js"></script>
<script type="text/javascript" src="../../common/calendar/calendar-zh.js"></script>
<script type="text/javascript" src="../../common/calendar/calendar-setup.js"></script>
<script type="text/javascript" src="../../common/dhtmlx/dhtmlxcommon.js"></script>
<script type="text/javascript" src="../../common/dhtmlx/dhtmlxCombo/dhtmlxcombo.js"></script>
<script type="text/javascript" src="../../js/public.js"></script>
<script language="JavaScript">
<!--
//动态新增行
function addrow(){
var i=lines.rows.length+4;//新增的第几行行数
var comboid1=i*3+1;//dhtmlxCombo下拉框控件ID
var comboid2=i*3+2;//dhtmlxCombo下拉框控件ID
var comboid3=i*3+3;//dhtmlxCombo下拉框控件ID
//alert(comboid);
var row=batchTable.insertRow(batchTable.rows.length);
row.id="row"+i;
row.align="center";
var col=row.insertCell(0);
col.className="td_public";
col.innerHTML="<a href=\"#\" onClick=\"addrow()\"><img src=\"../../images/button/add_button.gif\" width=\"16\" height=\"16\" border=\"0\"></a> <a href=\"#\" onClick=\"delrow("+i+")\"><img src=\"../../images/button/delete.gif\" width=\"16\" height=\"16\" border=\"0\"></a>";
col=row.insertCell(1);
col.className="td_public";
col.innerHTML="<select name=\"textfield5\" id=\"combo"+comboid1+"\" class=\"batchform\"></select>";
col=row.insertCell(2);
col.className="td_public";
col.innerHTML="<input name=\"textfield16\" type=\"text\" class=\"batchform\">";
col=row.insertCell(3);
col.className="td_public";
col.innerHTML="<select name=\"textfield10\" id=\"combo"+comboid2+"\" class=\"batchform\"></select>";
col=row.insertCell(4);
col.className="td_public";
col.innerHTML="<select name=\"textfield11\" id=\"combo"+comboid3+"\" class=\"batchform\"></select>";
col=row.insertCell(5);
col.className="td_public";
col.innerHTML="<input type=\"text\" name=\"textfield12\" class=\"batchform\">";
col=row.insertCell(6);
col.className="td_public";
col.innerHTML="<input type=\"text\" name=\"textfield13\" class=\"batchform\">";
col=row.insertCell(7);
col.className="td_public";
col.innerHTML="<input type=\"text\" name=\"textfield14\" class=\"batchform\">";
col=row.insertCell(8);
col.className="td_public";
col.innerHTML="<input type=\"text\" name=\"textfield15\" class=\"batchform\">";
//alert(i);
dhtmlXComboFromSelect("combo"+comboid1);//dhtmlxCombo控件select设置
dhtmlXComboFromSelect("combo"+comboid2);//dhtmlxCombo控件select设置
dhtmlXComboFromSelect("combo"+comboid3);//dhtmlxCombo控件select设置
}
//删除{zh1}一行
function delrow(rowid){
//if(lines.rows.length==0){
// return false;
//}
//lines.deleteRow();
var row=document.getElementById("row"+rowid);
//alert(row);
var index=row.rowIndex;
var objTable=document.getElementById("batchTable");
objTable.deleteRow(index);
}
//-->
</script>
</head>
<body>
<form action="" method="post">
<table class="table_public" width="{bfb}" align="center">
    <tr>
      <td colspan="6" class="td_public"><img src="../../images/title_front.gif" width="15" height="15">&nbsp;<span class="table_head">发货计划添加</span>&nbsp;</td>
    </tr>
    <tr>
      <td align="right" class="td_public">收货客户编号：</td>
      <td class="td_public"><input type="text" name="textfield" id="textfield"></td>
      <td align="right" class="td_public">收货客户名称：</td>
      <td class="td_public"><input type="text" name="textfield2" id="textfield2"></td>
      <td align="right" class="td_public">委托客户：</td>
      <td class="td_public"><input type="text" name="textfield3" id="textfield3"></td>
    </tr>
    <tr>
      <td align="right" class="td_public">目的地：</td>
      <td class="td_public"><select name="select3" id="combo1">
        </select></td>
      <td align="right" class="td_public">结算方式：</td>
      <td class="td_public"><select name="select2" id="combo2">
        </select></td>
      <td align="right" class="td_public">预计发车日期：</td>
      <td class="td_public"><input type="text" name="time" id="time1">
        <img src="../../common/calendar/images/button.gif" id="time_button1" style="cursor: pointer; border: 1px solid red;" title="Date selector" onMouseOver="this.style.background='red';" onMouseOut="this.style.background=''" /></td>
    </tr>
    <tr>
      <td align="right" class="td_public">装车单号：</td>
      <td class="td_public"><input type="text" name="textfield7" id="textfield7"></td>
      <td align="right" class="td_public">销单号：</td>
      <td class="td_public"><input type="text" name="textfield8" id="textfield8"></td>
      <td align="right" class="td_public">发货计划日期：</td>
      <td class="td_public"><input type="text" name="textfield9" id="time2">
        <img src="../../common/calendar/images/button.gif" id="time_button2" style="cursor: pointer; border: 1px solid red;" title="Date selector" onMouseOver="this.style.background='red';" onMouseOut="this.style.background=''" /></td>
    </tr>
    <tr>
      <td align="right" class="td_public">发货仓库：</td>
      <td class="td_public"><input type="text" name="textfield19" id="textfield16"></td>
      <td align="right" class="td_public">计划类型：</td>
      <td class="td_public"><select name="select" id="combo3">
        </select>
      </td>
      <td align="right" class="td_public">要求到货日期：</td>
      <td class="td_public"><input type="text" name="textfield20" id="time3">
        <img src="../../common/calendar/images/button.gif" id="time_button3" style="cursor: pointer; border: 1px solid red;" title="Date selector" onMouseOver="this.style.background='red';" onMouseOut="this.style.background=''" /></td>
    </tr>
</table>
<br>
<table id="batchTable" class="table_public" width="{bfb}" align="center">
    <tr>
      <th class="td_public">新增/删除</th>
      <th class="td_public">起始地</th>
      <th class="td_public">货物名称</th>
      <th class="td_public">品种</th>
      <th class="td_public">规格</th>
      <th class="td_public">货值</th>
      <th class="td_public">数量</th>
      <th class="td_public">重量</th>
      <th class="td_public">体积</th>
    </tr>
    <tr align="center" id="row1">
      <td class="td_public"><a href="#" onClick="addrow()"><img src="../../images/button/add_button.gif" width="16" height="16" border="0"></a> <a href="#" onClick="delrow(1)"><img src="../../images/button/delete.gif" width="16" height="16" border="0"></a></td>
      <td class="td_public"><select name="textfield5" id="combo4" class="batchform">
        </select></td>
      <td class="td_public"><input name="textfield16" type="text" class="batchform"></td>
      <td class="td_public"><select name="textfield10" id="combo5" class="batchform">
        </select></td>
      <td class="td_public"><select name="textfield11" id="combo6" class="batchform">
        </select></td>
      <td class="td_public"><input type="text" name="textfield12" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield13" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield14" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield15" class="batchform"></td>
    </tr>
    <tr align="center" id="row2">
      <td class="td_public"><a href="#" onClick="addrow()"><img src="../../images/button/add_button.gif" width="16" height="16" border="0"></a> <a href="#" onClick="delrow(2)"><img src="../../images/button/delete.gif" width="16" height="16" border="0"></a></td>
      <td class="td_public"><select name="textfield4" id="combo7" class="batchform">
        </select></td>
      <td class="td_public"><input name="textfield17" type="text" class="batchform"></td>
      <td class="td_public"><select name="textfield10" id="combo8" class="batchform">
        </select></td>
      <td class="td_public"><select name="textfield11" id="combo9" class="batchform">
        </select></td>
      <td class="td_public"><input type="text" name="textfield12" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield13" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield14" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield15" class="batchform"></td>
    </tr>
    <tr align="center" id="row3">
      <td class="td_public"><a href="#" onClick="addrow()"><img src="../../images/button/add_button.gif" width="16" height="16" border="0"></a> <a href="#" onClick="delrow(3)"><img src="../../images/button/delete.gif" width="16" height="16" border="0"></a></td>
      <td class="td_public"><select name="textfield6" id="combo10" class="batchform">
        </select></td>
      <td class="td_public"><input type="text" name="textfield18" id="textfield15" class="batchform"></td>
      <td class="td_public"><select name="textfield10" id="combo11" class="batchform">
        </select></td>
      <td class="td_public"><select name="textfield11" id="combo12" class="batchform">
        </select></td>
      <td class="td_public"><input type="text" name="textfield12" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield13" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield14" class="batchform"></td>
      <td class="td_public"><input type="text" name="textfield15" class="batchform"></td>
    </tr>
    <tbody id="lines" name="lines"></tbody>
    </table>
    <table width="{bfb}" align="center">
    <tr align="center">
      <td><input type="image" src="../../images/button/submit.gif" style="cursor:hand;border:0px;width:73px;height:23px;" align="absmiddle"></td>
    </tr>
</table>
</form>
<form action="" enctype="multipart/form-data" method="post">
数据导入：
<input type="file" name="excel" style="width:250px;">
<input type="image" src="../../images/button/import.gif" style="cursor:hand;border:0px;width:73px;height:23px;" align="absmiddle">
</form>
<!--日期控件引用-->
<script type="text/javascript" src="../../common/calendar/click.js"></script>
<!--dhtmlxCombo控件select设置引用-->
<script type="text/javascript" src="../../common/dhtmlx/dhtmlxCombo/setdhtmlxcombo.js"></script>
</body>
</html>



郑重声明：资讯 【select下拉框美化加js运态添加删除表格单元格综合使用_bangbangnt的空间】由 发布，版权归原作者及其所在单位，其原创性以及文中陈述文字和内容未经(企业库qiyeku.com)证实，请读者仅作参考，并请自行核实相关内容。若本文有侵犯到您的版权， 请你提供相关证明及申请并与我们联系（qiyeku # qq.com）或【在线投诉】，我们审核后将会尽快处理。
—— 相关资讯 ——
格雷余码编码器_{jd1}量式编码器厂商_桁萱自动化科技(多图)-多圈并行编码器_单圈{jd1}值编码器哪家便宜_桁萱自动化科技
格雷余码编码器_{jd1}量式编码器厂商_桁萱自动化科技(多图)-多圈并行编码器_单圈{jd1}值编码器哪家便宜_桁萱自动化科技
2019/5/11
ZXQ-1自动金相镶嵌机使用方法及维护保养介绍
ZXQ-1自动金相镶嵌机使用方法及维护保养介绍
2018/11/13
衡阳电力保护管
衡阳电力保护管
2018/2/14
深圳市长许宗衡被双规 或与黄光裕案有关
深圳市长许宗衡被双规 或与黄光裕案有关
2009/6/9
如何选择合适的载重刹车片
如何选择合适的载重刹车片
2010/5/22
Windowsxp sp1【骨头修正版】_电脑技术学习交流_百度空间
Windowsxp sp1【骨头修正版】_电脑技术学习交流_百度空间
2010/6/16
QQ截图里的画刷工具| 爱归零
QQ截图里的画刷工具| 爱归零
2010/7/9
黑枸杞价格是多少
黑枸杞价格是多少
2015/3/19
去眼袋眼霜效果排名
去眼袋眼霜效果排名
2015/3/23
成海机床销售部开展春季郊游活动
成海机床销售部开展春季郊游活动
2015/4/3
长沙激光祛斑哪个医院好
长沙激光祛斑哪个医院好
2015/3/8
功果桥水电站10kV高压开关柜及其附属设备招标公告- liyongjinda ...
功果桥水电站10kV高压开关柜及其附属设备招标公告- liyongjinda ...
2010/5/7
我国卧式砂磨机的使用现状-耐祺机械_ 耐祺_ 中金博客
我国卧式砂磨机的使用现状-耐祺机械_ 耐祺_ 中金博客
2010/1/9