表格动态加，删除行 单元格元素添加点击事件

id区别不同的点击按钮（区别计算按钮点击  通过时间差异）  区别删除按钮 用parent追踪
，name提交数据到后台

前台

                                     <div class="span12">

                                                    <button  type="button" class=" act-add">
                                                        <i class="icon-plus"></i>添加款项交付
                                                    </button>

                                                    <table id="viewtable"
                                                        class="table table-striped table-bordered table-hover">
                                                        <thead>
                                                            <tr>
                                                                <th>合同付款名称</th>
                                                                <th>付款时间</th>
                                                                <th>付款金额（百分比）</th>
                                                                <th>付款金额</th>
                                                                <th>付款备注</th>
                                                                <th>操作</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>

                                                        </tbody>
                                                    </table>


                                                </div>

jquery

 var template = function() {/*   

                 <tr>
                 <td>   
                     <input type="text" name="contractPayName" value=" ">
                     
                 </td>
               <td width=20>
                 <label class="control-label" for="contractPayDate"></label>
                 <div class="input-append date form_date" data-link-field="contractPayDate" data-link-format="yyyy-mm-dd">
                 <input type="text"  readonly="readonly"  style="width:100px;" />
                 <span class="add-on"><i class="icon-remove"></i></span>
                 <span class="add-on"><i class="icon-calendar"></i></span>
                 <input type="hidden" class="hide-cal" id="contractPayDate" name="contractPayDate" style="width:100px;" value=""/>
             </div>                               
                 </td>   
                 <td ><input type="text"  id="@@Percent" name="contractPayPercent" style="width: 90px;" value=""></td>              
                 <td ><input type="text"  id="@@Amount" name="contractPayAmount" style="width: 90px;" value="">
                 <button id="@@calculatePrice" type="button" class="btn btn-mini btn-purple" title="计算产品总价">计算</button>
                 
                 </td>
                <td width=60><input type="text" name="contractPayRemark" style="width: 90px;" value=" "></td>
                 
                 <td>
                     <button class="btn btn-mini btn-danger act-del">
                         <i class="icon-trash" ></i>
                     </button>
                 </td>
                 
                 </tr>
             */};
   
             template = (template+'').slice(15,-4);
                 $(".act-add").click(function(){
                     
                     var contractPayAmountId= "aa"+(new Date()).getTime();
                     var contractPayPercentId="bb"+(new Date()).getTime();
                     var calculatePriceId = "cc"+(new Date()).getTime();
                     
                     var templatenew = template.replace("@@Amount", contractPayAmountId);
                     templatenew = templatenew.replace("@@Percent",contractPayPercentId);
                     templatenew = templatenew.replace("@@calculatePrice",calculatePriceId);
                     
                     var t = $(templatenew);
                     t.find(".form_date").datetimepicker({
                        language: "zh-CN",
                        format: "yyyy-mm-dd",
                        weekStart: 1,
                        todayBtn:  1,
                        autoclose: 1,
                        todayHighlight: 1,
                        startView: 2,
                        minView: 2,
                        forceParse: 0,
                       });
                     $("#viewtable tbody").append(t);
                     //
                 
                     
                     //计算本次付款
                     function calculatePrice() {
                         //合同付款总价
                         var contractQuote=Number($('#contractQuote').val());
                             
                         // 比例
                            var contractPayAmount = "";
                            var contractPayPercent = Number($('#' + contractPayPercentId).val());
                            if (contractPayPercent && contractPayPercent > 0) {
                                contractPayAmount = (contractPayPercent / 100) * contractQuote;
                                contractPayAmount = contractPayAmount.toFixed(2);
                            }
                                                               
                            // 填充产品实际款项交付
                            $("#" + contractPayAmountId).val(contractPayAmount);
                     }

                                   
                         // 为计算按钮添加click事件
                         $('#'+calculatePriceId).click(calculatePrice);
                         
                         // 百分比变更后自动计算
                         $('#contractQuote,#'+contractPayPercentId).change(calculatePrice);
                     
                  
                      
                     return false;
                 });
                 
                 $("#viewtable").delegate(".act-del", "click", function(){
                     
                     var cid = $(this).parents("tr").eq(0).find(":hidden").val();
                                  $(this).parents("tr").eq(0).remove();
                     
                     return false;
                 });