我希望一个数组在循环时显示另一个数组的值
Posted
技术标签:
【中文标题】我希望一个数组在循环时显示另一个数组的值【英文标题】:I want one array to display the value of the other array when looped through 【发布时间】:2019-12-30 04:06:05 【问题描述】:我在 html 中创建了一个表格,其中有一行和三列。这些是sumName
、sumEmail
和sumCard
。我想从另一个表中获取文本值,ID 为 commentNameA
、commentEmailA
和 commentCardA
,并让它们相应地转移到总 ID。
我尝试过使用不同的功能,但找不到合适的解决方案。
Java 脚本:
function summary()
var sumShow = [name, email, card];
var position = [posName, posEmail, posCard];
var name = document.getElementById("commentNameA").value;
var email = document.getElementById("commentEmailA").value;
var card = document.getElementById("commentCardA").value;
var posName = document.getElementById("sumName").innerHTML;
var posEmail = document.getElementById("sumEmail").innerHTML;
var posCard = document.getElementById("sumCard").innerHTML;
for(var i = 0; i < 3; i++ )
var k = 0;
position[i] = sumShow[k];
k += 1;
HTML:
<form action=" " method=" " >
<table id = "order">
<tr>
<td id = "commentName">Name:<input type="text" name="Name" id="commentNameA" class="name" placeholder="Enter Your Full Name" onkeyup="validateName()" ></td>
</tr>
<tr>
<td id="commentEmail">Email:<input type="email" name="Email" id="commentEmailA" onkeyup="validateEmail()" class="email" placeholder="Enter Your Email"></td>
</tr>
<tr>
<td id ="commentCard">Card:<input type="text" name="Card_Number" id="commentCardA" class="card" onkeyup="update(this.value)" placeholder="Enter a Proxy Credit Card Number" ></td>
</tr>
<tr>
<td id="commentButton"><button id="commentForm" type="submit" name="submit" class="btn" >Submit Form</button></td>
</tr>
</table>
</form>
<div id="sumTable" class="summary">
<table id="sumTableA" class="summaryTable" style="width:100%" >
<tr>
<th>Name</th>
<th>Email</th>
<th>Card Number</th>
</tr>
<tr>
<td id="sumName"> </td>
<td id="sumEmail"> </td>
<td id="sumCard"> </td>
</tr>
<input id="sumBtn" onclick="summary()" type="submit" name="summary" class="sumBtn" value="summary" />
</table>
</div>
没有错误。
【问题讨论】:
【参考方案1】:例如posName
将 innerHTML 存储为字符串,而不是在 DOM 中对该属性的引用。所以当你 cange position[i] = sumShow[k];
时,你并没有修改 DOM,而只是改变了变量中的字符串。
要解决这个问题,请将实际的 DOM 节点存储在例如posName
并将值应用于循环内的 innerHTML:position[i].innerHTML = sumShow[k];
我也认为没有理由使用不同的变量 i 和 k。您可以将 i 用于两个数组。如果输入不包含 HTML 代码而只包含字符串,您可以使用 textContent
属性而不是 innerHTML
插入它们。
function summary()
var name = document.getElementById("commentNameA").value;
var email = document.getElementById("commentEmailA").value;
var card = document.getElementById("commentCardA").value;
var posName = document.getElementById("sumName");
var posEmail = document.getElementById("sumEmail");
var posCard = document.getElementById("sumCard");
var sumShow = [name, email, card];
var position = [posName, posEmail, posCard];
for(var i = 0; i < position.length; i++ )
position[i].textContent = sumShow[i];
<form action=" " method=" ">
<table id="order">
<tr>
<td id="commentName">Name:<input type="text" name="Name" id="commentNameA" class="name" placeholder="Enter Your Full Name"></td>
</tr>
<tr>
<td id="commentEmail">Email:<input type="email" name="Email" id="commentEmailA" class="email" placeholder="Enter Your Email"></td>
</tr>
<tr>
<td id="commentCard">Card:<input type="text" name="Card_Number" id="commentCardA" class="card" placeholder="Enter a Proxy Credit Card Number"></td>
</tr>
</table>
</form>
<div id="sumTable" class="summary">
<table id="sumTableA" class="summaryTable" style="width:100%">
<tr>
<th>Name</th>
<th>Email</th>
<th>Card Number</th>
</tr>
<tr>
<td id="sumName"> </td>
<td id="sumEmail"> </td>
<td id="sumCard"> </td>
</tr>
</table>
<input id="sumBtn" onclick="summary()" type="submit" name="summary" class="sumBtn" value="summary" />
</div>
【讨论】:
你的天才,非常感谢你的反馈和时间......它的工作原理!!!以上是关于我希望一个数组在循环时显示另一个数组的值的主要内容,如果未能解决你的问题,请参考以下文章