html 代码 <!DOCTYPE html><br /><br /><br /><br /> <html><br /><br /><br /><br /> <head><br /><br /><br /><br /> <meta charset=”UTF-8″><br /><br /><br /><br /> <title></title><br /><br /><br /><br /> <script src=”http://cdn.bootcss.com/jquery/3.1.1/jquery.js”></script><br /><br /><br /><br /> <!–<script src=”js/jquery-3.1.1.js”></script>–><br /><br /><br /><br /> </head><br /><br /><br /><br /> <body><br /><br /><br /><br /> <input type=”text” name=”t1″ id=”t1″ placeholder=”请输入rows” style=”height: 30px;”/><br /><br /><br /><br /> <input type=”text” name=”t2″ id=”t2″ placeholder=”请输入cols” style=”height: 30px;”/><br /><br /><br /><br /> <input type=”button” name=”b1″ id=”b1″ value=”生成表格” style=”height: 30px;”/><br /><br /><br /><br /> <div></div><br /><br /><br /><br /> <script type=”text/javascript”></p><br /><br /><br /> <p> $(“div”).append(“<table></table>”);<br /><br /><br /><br /> $(“input[name=’b1′]”).click(function(){<br /><br /><br /><br /> $(“table”).html(“”).css(“borderCollapse”,”collapse”)<br /><br /><br /><br /> var rows=$(“#t1”).val();<br /><br /><br /><br /> var cols=$(“#t2”).val();<br /><br /><br /><br /> for(var i=0;i<rows;i++){<br /><br /><br /><br /> $(“table”).append(“<tr></tr>”);<br /><br /><br /><br /> }<br /><br /><br /><br /> for(var i=0;i<cols;i++){<br /><br /><br /><br /> $(“tr”).append(“<td></td>”);<br /><br /><br /><br /> }<br /><br /><br /><br /> $(“td”).css({width:”150px”,height:”40px”,border:” 1px solid black”,textAlign:”center”})<br /><br /><br /><br /> $(“tr”).append(“<input type=’button’ class=’c2 c3′ name=’delete1′ value=’删除’/>”);<br /><br /><br /><br /> $(“tr”).append(“<input type=’button’ class=’c2 c3′ name=’addtop’ value=’添加上一行’/>”);<br /><br /><br /><br /> $(“tr”).append(“<input type=’button’ class=’c2 c3′ name=’addbottom’ value=’添加下一行’/>”);<br /><br /><br /><br /> $(“.c3″).css({width:”150px”,height:”42px”,background:”#e35435″,border:”1px solid black”})<br /><br /><br /><br /> $(“input[name=’addtop’]”).click(function(){<br /><br /><br /><br /> var newtr=$(this).parent().clone(true);<br /><br /><br /><br /> newtr.children(“td”).html(“”).css(“background”,”red”);<br /><br /><br /><br /> $(this).parent().before(newtr);<br /><br /><br /><br /> // newtr.css(“background”,”red”);//这里把.css拿到上面去 不然整行BG都变色了 不雅观<br /><br /><br /><br /> })<br /><br /><br /><br /> $(“input[name=’addbottom’]”).click(function(){<br /><br /><br /><br /> var newtr=$(this).parent().clone(true);</p><br /><br /><br /> <p> newtr.children(“td”).html(“”).css(“background”,”gold”);<br /><br /><br /><br /> $(this).parent().after(newtr);<br /><br /><br /><br /> // newtr.css(“background”,”gold”);//<br /><br /><br /><br /> })<br /><br /><br /><br /> $(“input[name=’delete1′]”).click(function(){<br /><br /><br /><br /> $(this).parent().detach();<br /><br /><br /><br /> })<br /><br /><br /><br /> $(“td”).click(function(e){<br /><br /><br /><br /> var that=this;<br /><br /><br /><br /> var content=$(that).text();<br /><br /><br /><br /> $(that).html(“<input type=’text’ class=’in1′ />”);<br /><br /><br /><br /> $(“input[class=’in1′]”).css({width:”150px”,height:”38px”,border:”0″,textAlign:”center”})<br /><br /><br /><br /> $(“input[class=’in1′]”).focus();<br /><br /><br /><br /> $(“input[class=’in1′]”).val(content);<br /><br /><br /><br /> $(“input[class=’in1′]”).click(function(e){<br /><br /><br /><br /> e.stopPropagation();<br /><br /><br /><br /> })<br /><br /><br /><br /> $(“input[class=’in1′]”).blur(function(){<br /><br /><br /><br /> $(that).html($(this).val());<br /><br /><br /><br /> })<br /><br /><br /><br /> })<br /><br /><br /><br /> })<br /><br /><br /><br /> </script><br /><br /><br /><br /> </body><br /><br /><br /><br /> </html>
评论前必须登录!
注册