gpt4 book ai didi

javascript - 将输入从一个表复制到同一文档上的另一个表

转载 作者:行者123 更新时间:2023-12-03 09:31:33 25 4
gpt4 key购买 nike

我想使用 javascript 将输入从一个表复制到同一文档的另一个表。有2张 table 。在第一个表中,用户将输入所需的值。这些值将用作第二个表中的列标题。到目前为止,我的脚本还没有得到它。请各位专家知道我做错了什么。

<!DOCTYPE html>
<html>
<head>
<title>PrtQual</title>
<style type="text/css">
body {font-family: Arial, Verdana, Helvetica,Sans-serif; padding: 0px;
margin-left: 0px; margin-left: 50px; max-width: 800px;}
p, table {margin-left: 25px;}
th {font-weight: bold; font-size: 14px; border: 1px; border-style: solid;
margin: 0px; border-colapse: colapse; border-spacing: 0px;}
td {font-weight: Normal; font-size: 14px; border: 1px; border-style: solid;
margin: 0px; border-colapse: colapse; border-spacing: 0px;}
.hide {display: none;}
.show {display: display;}
.hove: hover {background-color: rgb(250,250,150);}
.btn {padding: 5px 5px 5px 5px; background-color: rgb(240,240,240); margin-
left: 25px; text-align: center; font-size: 12px; font-weight: bold; border:
1px; }
.btn:hover {background-color: rgb(250,250,150)}
</style>

<script
src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
</head>
<body>

<table id="main">
<tbody>
<tr class="hide">
<td id="ddnfmat"><input type="text" class="hove"/></td>
</tr>
<tr>
<td>PrtQual</td>
</tr>
<tr>
<td>Index</td>
</tr>
<tr>
<td id="ddn"><input type="text" class="hove" /></td>
</tr>
</tbody>
</table>
<p><i> To add a new header, click on the button below</i></p>
<input class="btn" type="button" onclick="addNewheader()" value="Add new
factor">
<br><br>
<input class="btn" type="button" onclick="copyheader()" value="Finish">
<br><br>
<table id="exp">
<thead>
<tr id="exphdr">
<th>s/n</th>
<th>PrtQual</th>
<th>Index</th>
<th id="ddnO"><input type="text" readonly /></th>
<th id="ddnT"><input type="text" readonly /></th>
<th id="ddnTh"><input type="text" readonly /></th>
<th>Comment</th>
</tr>
</thead>
<tbody>
</tbody>
</table>

<script>
function addNewheader() {
var table = document.getElementById('main');
var elmnt = table.getElementsByTagName("TR")[0];
var cln = elmnt.cloneNode(true);
table.tBodies[0].appendChild(cln);
var p = document.getElementById('main').rows.length;
var q = p - 1;
var s = document.getElementById('main').rows[q];
s.setAttribute("class", "show");
}
</script>

<script>
function copyheader() {
for (i=3, i<6, i++) {
tableheader(i)
}
}
</script>

<script>
function tableheader(i){
var tble = document.getElementById('main');
var mytr = tble.getElementByTagName('tr')[i];
var mytd = mytr.getElementByTagName('td')[0];
var myinput = mytd.getElementByTagName('input')[0];
var myval = myinput.value;

var tbl = document.getElementById('exp');
var hdr = tbl.getElementByTagName('tr')[0];
var hddata = hdr.getElementByTagName('td')[i];
var inp = hddata.getElementByTagName('input')[0];
inp.value = myval;
}
</script>
</body>
</html>

最佳答案

正如 m69 提到的,方法名称错误。之后 for 循环定义不正确。在这些更改之后,除了使用了错误的选择器之外,代码并没有出错。在第二个表中,您尝试选择并操作 <TH>不是<TD>这就是为什么“hddata”未定义。

<script>

function addNewheader() {
var table = document.getElementById('main');
var elmnt = table.getElementsByTagName("TR")[0];
var cln = elmnt.cloneNode(true);
table.tBodies[0].appendChild(cln);
var p = document.getElementById('main').rows.length;
var q = p - 1;
var s = document.getElementById('main').rows[q];
s.setAttribute("class", "show");
}

function copyheader() {
for ( var i = 3 ; i < 6 ; i++) { // the loop was previously using comma separators in place of semicolons
tableheader(i)
}
}

function tableheader(i){
var tble = document.getElementById('main');
var mytr = tble.getElementsByTagName('tr')[i]; // all these method calls were misspelled
var mytd = mytr.getElementsByTagName('td')[0];
var myinput = mytd.getElementsByTagName('input')[0];
var myval = myinput.value;

var tbl = document.getElementById('exp');
var hdr = tbl.getElementsByTagName('tr')[0];
var hddata = hdr.getElementsByTagName('th')[i]; // select TH tags here NOT TDs!
var inp = hddata.getElementsByTagName('input')[0];
inp.value = myval;
}

</script>

关于javascript - 将输入从一个表复制到同一文档上的另一个表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31488157/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com