jquery实现动态添加、删除数据行

最新推荐文章于 2023-08-13 16:42:36 发布

zfmsa

最新推荐文章于 2023-08-13 16:42:36 发布

阅读量388

点赞数

文章标签： jQuery JavaScript QQ JSP Windows ViewUI

想找份用jsp做网站的web2.0的公司，谁能帮我啊，QQ:64738479，可以联系我。

<html>
    <head>
        <meta http-equiv="Content-Language" content="zh-cn">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Untitled Document</title>
        <script src=jquery-1.2.1.js>
        </script>
    </head>
    <body>
    <div>
         添加门店 
    <input type="text" name="warehouseno" maxlength="20" value="" οnchange="javascript:udf_lookup(this, -1, '')"
    class="MainInput">
    <img src="images/button_lookup.gif" οnclick="javascript:lookupBasWarehouseFORwarehouseno()"
    width="15" height="15" border="0" alt="Lookup" align="middle" hspace="3" style='display:none'>

         <table border=1 class="ListTable" cellSpacing="0" bordercolor="#CEDFFF" cellPadding="2" width="100%">
             <tr>
                 <td noWrap bgColor="#cedfff">仓库编码</td>
      <td noWrap bgColor="#cedfff">销售门店</td>
      <td noWrap bgColor="#cedfff">操作</td>
             </tr>

     
     <tr class="templeteRow">

<input type=hidden name="newRowId" class="newRowId">

<td><span class="newRowNo"></span></td>
      <td><span class="newRowName"></span></td>
      <td>
       <A href="" οnclick="return false;" title="删除" class="delDetailRow_Link">
                         <img src="images/del.gif" style="border:0px">
                     </A>
                 </td>
             </tr>
         </table>
   </div>

    </body>

<script type="text/javascript">
$(document).ready(function(){
   $("tr.templeteRow").hide();//确保隐藏
   addNewRow(123,'1.1',"哈哈1");
   addNewRow(234,'1.2',"哈哈2");
   addNewRow(345,'1.3',"哈哈3");
});

function getTimeRndString() {
   var tm=new Date();
   var str=tm.getMilliseconds()+tm.getSeconds()*60+tm.getMinutes()*3600+tm.getHours()*60*3600+tm.getDay()*3600*24+tm.getMonth()*3600*24*31+tm.getYear()*3600*24*31*12;
   return str;
};

/**
* 添加行
* @param {Object} id
* @param {Object} no
* @param {Object} name
*/
function addNewRow(id,no,name){
   var templeteRow=$("tr.templeteRow");
        var newRow = templeteRow.clone(true);
   var rndID="tmpUID"+getTimeRndString();
        newRow.insertBefore(templeteRow);
        newRow.show();
   newRow.attr("class", "valueRow");
   newRow.attr("id", rndID);

   newRow.find("input.newRowId").attr("value",id);
   newRow.find("span.newRowNo").text(no);
   newRow.find("span.newRowName").text(name);

   newRow.find("a.delDetailRow_Link").attr("id",rndID);
   newRow.find("a.delDetailRow_Link").click(function(){
        act_delDetailRow(this);
     });
}

/**
* 删除所在行
* @param {Object} who
*/
function act_delDetailRow(who){
   $("#"+who.id).remove();
}
</script>
</html>

zfmsa

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery实现动态添加、删除数据行

想找份用jsp做网站的web2.0的公司，谁能帮我啊，QQ:64738479，可以联系我。 &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Language" content="zh-cn"&gt; &lt;meta http-equiv="Content-Type" content=&quot
复制链接

扫一扫