html 代码 <!DOCTYPE <span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>><br /><br /><br /><br /><br /> <<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>><br /><br /><br /><br /><br /> <head><br /><br /><br /><br /><br /> <meta charset=”UTF-8″><br /><br /><br /><br /><br /> <title></title><br /><br /><br /><br /><br /> <script src=”http://cdn.bootcss.com/<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/jquery" title="jquery" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">jquery</a></span>/3.1.1/<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/jquery" title="jquery" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">jquery</a></span>.<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/javascript" title="js" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">js</a></span>”></script><br /><br /><br /><br /><br /> <!–<script src=”<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/javascript" title="js" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">js</a></span>/<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/jquery" title="jquery" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">jquery</a></span>-3.1.1.js”></script>–><br /><br /><br /><br /><br /> </head><br /><br /><br /><br /><br /> <body><br /><br /><br /><br /><br /> <input type=”text” name=”t1″ id=”t1″ placeholder=”请输入rows” style=”height: 30px;”/><br /><br /><br /><br /><br /> <input type=”text” name=”t2″ id=”t2″ placeholder=”请输入cols” style=”height: 30px;”/><br /><br /><br /><br /><br /> <input type=”button” name=”b1″ id=”b1″ value=”生成表格” style=”height: 30px;”/><br /><br /><br /><br /><br /> <div></div><br /><br /><br /><br /><br /> <script type=”text/javascript”></p><br /><br /><br /><br /> <p> $(“div”).append(“<table></table>”);<br /><br /><br /><br /><br /> $(“input[name=’b1′]”).click(function(){<br /><br /><br /><br /><br /> $(“table”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>(“”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>(“borderCollapse”,”collapse”)<br /><br /><br /><br /><br /> var rows=$(“#t1”).val();<br /><br /><br /><br /><br /> var cols=$(“#t2”).val();<br /><br /><br /><br /><br /> for(var i=0;i<rows;i++){<br /><br /><br /><br /><br /> $(“table”).append(“<tr></tr>”);<br /><br /><br /><br /><br /> }<br /><br /><br /><br /><br /> for(var i=0;i<cols;i++){<br /><br /><br /><br /><br /> $(“tr”).append(“<td></td>”);<br /><br /><br /><br /><br /> }<br /><br /><br /><br /><br /> $(“td”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>({width:”150px”,height:”40px”,border:” 1px solid black”,textAlign:”center”})<br /><br /><br /><br /><br /> $(“tr”).append(“<input type=’button’ class=’c2 c3′ name=’delete1′ value=’删除’/>”);<br /><br /><br /><br /><br /> $(“tr”).append(“<input type=’button’ class=’c2 c3′ name=’addtop’ value=’添加上一行’/>”);<br /><br /><br /><br /><br /> $(“tr”).append(“<input type=’button’ class=’c2 c3′ name=’addbottom’ value=’添加下一行’/>”);<br /><br /><br /><br /><br /> $(“.c3″).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>({width:”150px”,height:”42px”,background:”#e35435″,border:”1px solid black”})<br /><br /><br /><br /><br /> $(“input[name=’addtop’]”).click(function(){<br /><br /><br /><br /><br /> var newtr=$(this).parent().clone(true);<br /><br /><br /><br /><br /> newtr.children(“td”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>(“”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>(“background”,”red”);<br /><br /><br /><br /><br /> $(this).parent().before(newtr);<br /><br /><br /><br /><br /> // newtr.<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>(“background”,”red”);//这里把.<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>拿到上面去 不然整行BG都变色了 不雅观<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> $(“input[name=’addbottom’]”).click(function(){<br /><br /><br /><br /><br /> var newtr=$(this).parent().clone(true);</p><br /><br /><br /><br /> <p> newtr.children(“td”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/html" title="html" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">html</a></span>(“”).<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>(“background”,”gold”);<br /><br /><br /><br /><br /> $(this).parent().after(newtr);<br /><br /><br /><br /><br /> // newtr.<span class='wp_keywordlink_affiliate'><a href="https://www.rokub.com/category/css" title="css" target="_blank" data-wpel-link="internal" rel="noopener noreferrer">css</a></span>(“background”,”gold”);//<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> $(“input[name=’delete1′]”).click(function(){<br /><br /><br /><br /><br /> $(this).parent().detach();<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> $(“td”).click(function(e){<br /><br /><br /><br /><br /> var that=this;<br /><br /><br /><br /><br /> var content=$(that).text();<br /><br /><br /><br /><br /> $(that).html(“<input type=’text’ class=’in1′ />”);<br /><br /><br /><br /><br /> $(“input[class=’in1′]”).css({width:”150px”,height:”38px”,border:”0″,textAlign:”center”})<br /><br /><br /><br /><br /> $(“input[class=’in1′]”).focus();<br /><br /><br /><br /><br /> $(“input[class=’in1′]”).val(content);<br /><br /><br /><br /><br /> $(“input[class=’in1′]”).click(function(e){<br /><br /><br /><br /><br /> e.stopPropagation();<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> $(“input[class=’in1′]”).blur(function(){<br /><br /><br /><br /><br /> $(that).html($(this).val());<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> })<br /><br /><br /><br /><br /> </script><br /><br /><br /><br /><br /> </body><br /><br /><br /><br /><br /> </html> » 本文来自：前端开发者 » 《JQ-表格实时编辑–修正版》 » 本文链接地址：https://www.rokub.com/8856.html » 您也可以订阅本站：https://www.rokub.com
前端开发者
评论前必须登录！
注册