js achieve buttons to add and remove tr

Screenshot

 

 Front-end code

 <form name="form1" method="post" action="pMmEquipMent2!saveMmEqiup.action" id="form1">
    <s:hidden key="vo.id"/>
    <s:hidden key="vo.dock"></s:hidden>
     <s:hidden key="act"/>
    <div>
        <table cellpadding="0" border="0" cellspacing="0" class="edittable" id="table1">
            <tbody id="tbody">
                
            </tbody>
        </table>
        <br />
        <input type="button" value="增加" onclick="f_addTr()"></input>
    </div> 
    </form>

 

 

 

//添加tr
         function f_addTr(){ 
             var allTr = $("#table1 tbody tr");
             if(allTr && allTr.length != 0 && allTr != null && allTr != ""){
                 var addEquip = $("tr:last:").children('td').eq(1).find("input[name=equipmentIds]");
                 var equipmentId = $(addEquip).val();
                     if(!equipmentId || equipmentId <= 0 || equipmentId == null || equipmentId==""){
                         alert("设备有空值请先选择");
                         return;
                  }
             }
                var html = '<tr>' 
                /* +'<td style="padding-top: 10px;">设备类型：</td>'
                +'<td><select style="width:120px" name="selectNames" class="selectName" onchange="addEquip(this)"></select>&nbsp;&nbsp;</td>' */
                +'<td style="padding-top: 10px;">设备：</td>'
                +'<td ><input type="text" name="equipNames" style="width:260px" class="equipAlias"><input type="hidden" name="equipmentIds">&nbsp;&nbsp;</td>'
                +'<td>位号：</td>'
                +'<td><input type="text" name="tags" style="width:150px" calss="tags"><input type="hidden" name="tagIds"></td>'
                +'<td>&nbsp;&nbsp;<input type="button" value="删除" onclick="deleteTr(this)"></td>'
                +'</tr>'
              $("#tbody").append(html);
              //f_addSelect();
              f_addEquip();
          } 

 

);
             where
          
              
              
              
              
              
              equipmentIds = $("tr:last:").children("td").eq(1).find("input[name=equipmentIds]");
            // $(".equipAlias").flushCache();
             $(equipAlias).val("");
             $(equipmentIds).val("");
             $(tags).val("");
             $(tagIds).val("");
             $(equipAlias).flushCache();
             $(tags).flushCache();
             $(equipAlias).autocomplete("${ctx}/mm/pMmEquipMent2!findEquipAlias.action",{
                    max: 30,                
                    minChars: 0,            list the number of entries//// automatically filled before activating the minimum character 
                    width: 260,              // prompt the width of the overflow hidden 
                    scrollHeight: 300,       // prompt the height of the overflow scroll bars 
                    matchContains: to true ,     // contains match is data parameters in the data, as long as the data is contained in the text box on the show 
                    AutoFill: false ,         // automatically fill 
                    mustMatch: to true ,          // to true: only allow matching results appear in the input box, the default is false 
                    dataType: "json" , 
                    Multiple : false ,      // whether multiple values ( "," separated)
                    matchSubset:true,
                    extraParams: {
                        //equipTypeId: function(){return $(obj).val();},
                        equipAlias: function(){ return encodeURIComponent($(equipAlias).val()); }
                    },
                    parse: function(data) {
                        var datas = new Array();
                        if(data !=null && data.length > 0){
                            $.each(data, function(i,item) {
                                var _data = {
                                        data:item,
                                        value:item.name,
                                        result:item.name
                                }
                                datas.push(_data);
                            })
                        }
                        return datas;
                    },
                    formatItem: function(row, i, max) {
                        return row.name;
                    },
                    formatResult: function(row) {
                        return row.name;
                    }
                    
                 }).result(function(e, item, value) {
                     //var equipmentIds = tr.children("td").eq(3).find("input[name=equipmentIds]");
                     $(equipmentIds).val(item.id);
                     f_selectTags(tags, tagIds, item.id);
                });
        }

 

// delete the corresponding TR 
          function deleteTr (obj) { 
             $ (obj) .parent () parent () parent () [.. 0] .removeChild ($ (obj) .parent () parent () [0. ]); 
          }