js動態添加trtd


<form id="addNewsFormData" name="addNewsFormData" isCheck="true" action="controller.SysRuleModelController">
 <table id="addNewsTableId" class="formTableSwap" border="0" align="center" cellpadding="0" cellspacing="1" >
<tr>
  <th> 類型:</th>
  <td > 
          <select id="dtomodelType" name="modelType">
              <option value="1" >業務模型</option>
              <option value="2" >實體類</option>
          </select>
  </td>
  <th> 中文名 :</th>
  <td > 
  <input type="text" class="text" id="dtochName" name="chName" notNull="false" maxLength="50" value="" />
  </td>
  <th> 英文名 :</th>
  <td > 
  <input type="text" class="text" id="dtoenName" name="enName" notNull="false" maxLength="100" value="" />
  </td>
</tr>
<tr>
  <th> 備注 :</th>
  <td colspan="5"> 
  <textarea id="dtoremark" name="remark" maxLength="100" rows="5" cols="60"></textarea>
  </td>
</tr>
  </table>

屬性管理
<div class="contentPanel">
    <table id="tab"  class="formTableSwap" border="0" align="center" cellpadding="0" cellspacing="1">
            <tr>
                <td style="width: 5px;">序號</td>
                <td>屬性中文名</td>
                <td>屬性英文名</td>
                <td>數據類型</td>
                <td>長度</td>
                <td>引用字典編碼</td>
                <td>描述</td>
                <td>操作</td>
           </tr>
           <tr id="1">
                <td><input type="text" name="modelAttrs[0].sequence" value="1"></td>
                <td><input type="text"  class="text" name="modelAttrs[0].chName" notNull="false" maxLength="50" value="" ></td>
                <td><input type="text"  class="text" name="modelAttrs[0].enName" notNull="false" maxLength="100" value="" ></td>
                <td>
                    <select name="modelAttrs[0].dataType" >
                        <option value="1" >字符型</option>
                        <option value="2" >數字型</option>
                        <option value="3" >日期型</option>
                        <option value="4" >浮點型</option>
                    </select>
                </td>
                <td><input type="text"  class="text" name="modelAttrs[0].dataLong" maxLength="50" value="" ></td>
                <td><input type="text"  class="text" name="modelAttrs[0].dictCode" maxLength="50" value="" ></td>
                <td><input type="text"  class="text" name="modelAttrs[0].remark" maxLength="50" value="" ></td>
                <td><a href="#" onclick="deltr(1)">刪除</a></td>
           </tr>
        </table>
        <table class="formTableSwap" border="0" align="center" cellpadding="0" cellspacing="1">
            <tr><td style="text-align:right;width: 800px;"><input type="button" id="but" value="增加"/></td></tr>
        </table>

</form>

</div>

</body>
<script type="text/javascript">
   $(document).ready(function(){  
       //增加<tr/>
    $("#but").click(function(){
        var _len = $("#tab tr").length;
        alert(_len)
        $("#tab").append("<tr id="+_len+" align='center'>"
                            +'<td><input type="text" name="modelAttrs['+(_len-1)+'].sequence" value="'+_len+'"></td>'
                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].chName" notNull="false" maxLength="50" value="" ></td>'
                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].enName" notNull="false" maxLength="100" value="" ></td>'
                            +'<td><select name="modelAttrs['+(_len-1)+'].dataType">'
                            +'<option value="1" >數字型</option>'
                            +'<option value="2" >字符型</option>'
                            +'<option value="3" >日期型</option>'
                            +'<option value="4" >浮點型</option>'
                            +'</select></td>'
                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].dataLong"  maxLength="50" value="" ></td>'
                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].dictCode"  maxLength="50" value="" ></td>'
                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].remark" maxLength="50" value="" ></td>'
                            +"<td><a href=\'#\' onclick=\'deltr("+_len+")\'>刪除</a></td>"
                        +"</tr>");            
    });
    
    });


//刪除<tr/>
function deltr(index){
//var _len = $("#tab tr").length;
$("tr[id='"+index+"']").remove();//刪除當前行
}

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM