Js 如何通过按钮点击新增一个整个表格的,有找到新增一行用来上传这样类似的。

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Js 如何通过按钮点击新增一个整个表格的,有找到新增一行用来上传这样类似的。相关的知识,希望对你有一定的参考价值。

参考技术A 给你两个办法.
1.把表格预先写好,然后设置为隐藏的属性.当onclick后,就吧这个属性修改未可见
2.使用<div id="table"></div> onlick后, document.getElementById("table").innerhtml("<table>.......
</table>")

当然,你可以用js的框架...例如jquery去插入,更快捷,更方便
参考技术B <html>
<head>
<script>
function Add()
var table=document.getElementById("table");
var row=table.insertRow(0);
var one=row.insertCell(0);
var two=row.insertCell(1);
one.innerHTML="1";
two.innerHTML="2";

</script>
</head>
<body>
<input type="button" value="添加表格" onClick="Add()">
<table id="table" border="1">
</table>
</body>
</html>
参考技术C 新增表格是什么概念?》?

js如何实现点击新增按钮之后自动增加一行,最多增加四行

我用了一个简单的,但是不管用,好像是id都是相同的,唉。大神求支招

利用table的head or footer

<table>
<tbody>
</tbody>
<tfoot>
<tr>
   <td></td>
</tr>
</tfoot>
</table>

javascript时,复制 table.tfoot.tr 即可。删除时,删除tbodies.tr即可。

参考技术A 你的append函数呢,把完整代码放上来吧,文字版追问

function append()
var tr = $("#areaText");
tr.after(tr.clone());

这是我用的函数

这是效果。后两个生成的填上的数值都只在第一个显示,清除按钮也只能操作第一个文本框

追答function append(ele) 
   var tr = $("#areaText");
   tr.clone().insertBefore($(ele).parent().parent());

onclick要改一下:

<a href=......  onclick="append(this)"  ......>新增</a>

追问

还是跟以前一样啊。这还是从第二个文本框选的,但是依旧是在第一个文本框显示的。而且清除按钮还是只能清除第一行文本框的内容。

追答

你没有给我看你是怎么清除的。我只是回答新增行的问题。
只能清除第一行估计你是通过清除id为areaText的元素这个方式实现的,你只要改成移除这个“清除按钮”的父级的父级(也就是tr)这个就行了。$(this).parent().parent().remove();

追问

先不管清除了。就说新增吧,就是这个文本框,文本框里面是选择地区。我在新增的文本框里面选择了地区之后他们却显示在第一个文本框中,这是什么问题。

追答

你网页代码都没拿上来我咋知道什么问题。不过我几乎可以肯定是你绝对用了插件,这个插件恰好是通过id来初始化的。

以上是关于Js 如何通过按钮点击新增一个整个表格的,有找到新增一行用来上传这样类似的。的主要内容,如果未能解决你的问题,请参考以下文章

在PHP中怎么实现新增数据,刷新表格,而不刷新整个页面。

JQuery如何实现在弹窗中点击按钮,继续弹出一个新弹窗,而不是打开新页面

js如何实现点击新增按钮之后自动增加一行,最多增加四行

用js添加li并在li里添加一个删除按钮,点击按钮 就要删除这个li, 但是我想问 我点击按钮 怎么找到这个li?

word中,怎样让两个表格并排放在一起一页纸

JS动态增加删除表格的问题 大家救救我吧