动态添加td输入框

动态添加td输入框 动态添加td输入框
function addRow() { 
        var tab=document.getElementById("tab");
        var n=document.getElementById("x").rowIndex+1;
        var tr=tab.insertRow(n);
        var td=tr.insertCell(0);                                                                                                                                                                                                                                                                     
        tr.innerHTML="<td class=\"table_body\" align=\"right\">日志内容</td><td class=\"table_none\" colspan=\"3\"><input name=\"syslogcontentcontent\" type=\"text\" id=\"pcuploadjpg\" style=\"width:64%\" onchange=\"CheckExt(this)\"></td><td class=\"table_none\"><img src=\"${ctx }/img/button/btn_delete_0.png\" btn=btn title='删除'  onClick=\"deleteRow(this)\" ></td>";
    }
动态添加td输入框
function deleteRow(obj) {
        $(obj).parent().parent().remove();
    }

 

动态在div中添加input框

1 2 3 4 5 6 7 8 function  hh(){           $("#zw1").append('<span id="news_' + InputCount+ '"><li style="margin-top:10px;" class="horizontal_onlyRight" ><input type="text" name="zw11" class="text_input100" onkeyup="tihuan(this)"  value=""/></li>'+"<li style='margin-top:10px;  margin-right:7px;' class=\"horizontal_onlyRight\" ><img onm ouseover=\"JavaScript:$(this).attr('src','${ctx }/img/newbtn/delete_1.png');\" onm ouseout=\"JavaScript:$(this).attr('src','${ctx }/img/newbtn/delete_0.png');\" src='${ctx }/img/newbtn/delete_0.png' btn=btn title='删除' onclick='javascript:deleteRowSpecs1(this,"+InputCount+");'></li><span/>");           InputCount++;      }           function  hh1(){               $("#zw2").append('<span id="news_' + InputCount+ '"><li style="margin-top:10px;"  class="horizontal_onlyRight" ><input type="text" name="zw22" onkeyup="tihuan(this)" class="text_input100"  ></li>'+"<li style='margin-top:10px;  margin-right:7px;'  class=\"horizontal_onlyRight\"><img onm ouseover=\"JavaScript:$(this).attr('src','${ctx }/img/newbtn/delete_1.png');\" onm ouseout=\"JavaScript:$(this).attr('src','${ctx }/img/newbtn/delete_0.png');\" src='${ctx }/img/newbtn/delete_0.png' btn=btn title='删除' onclick='javascript:deleteRowSpecs1(this,"+InputCount+");'></li><span/>");               InputCount++;        }

  

1 2 3 4 5 <div id="zw1" style="margin-bottom : 60px; margin-top:10px;" >                            <li class="horizontal_onlyRight" style="margin-top:10px;">                            <input name="zw11" class="text_input100" id="zw11" onkeyup="tihuan(this)" value="">                                 </li>                          </div>

1、innerHTML写入html代码方法,是原生态JS方法:
<div id="box"></div>
<script>document.getElementById("box").innerHTML="需要像box内写入的内容"</script>
2、append()是jQuery中的方法,需要先引用jQuery库代码。
<div id="box"></div>
<script>
$("#box").append("需要像box内写入的内容");
</script>

上一篇:实际效果:点击添加按钮添加新的一行,在行内可对数据进行编辑和删除


下一篇:解除作文网以及百度文库不能复制的限制