【发布时间】：2021-08-25 17:12:17
【问题描述】：
我有这个：
<% if(data.length){
for(var i = 0;i < data.length;i++) { %>
<tr>
<td data-label="NAME" id="clientName" value="<%= data[i].NAME %>"><%= data[i].NAME %> <%= data[i].LASTNAME %></td>
<td data-label="EMAIL" id="email" value="<%= data[i].EMAIL %>"><%= data[i].EMAIL %></td>
<td data-label="PHONE NUM"><%= data[i].PHONENUMBER %></td>
<td data-label="LOCATION"><%= data[i].LOCATION %></td>
<td data-label="COMPANY NAME"><%= data[i].COMPANYNAME %></td>
<td data-label="CODE" id="code" value="<%= data[i].CODE %>"><%= data[i].CODE %></td>
<td data-label="SEND PAYMENT"><button onclick="confirmPayment()">SEND PAYMENT</button></td>
<script>
function confirmPayment() {
var email = document.getElementById("email").value
var name = document.getElementById("clientName").value
var code = document.getElementById("code").value
console.log(name)
console.log(email)
console.log(code)
if (confirm('Are you sure you want to send Payment?'))
{
fetch('/sendPaymentCode', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({
email,
name,
code
})
})
}
else
{
console.log('Payment canceled.');
}
}
</script>
</tr>
<% }
}else{ %>
<% } %>
</tbody>
</table>
当我单击发送付款时，我基本上是在尝试获取用户电子邮件、代码和姓名的价值。但是，它不起作用，它在控制台中显示未定义。数据库中将有多个用户，因此当它使用循环显示在前端时，但当我尝试获取这些值时它没有记录任何内容。
这是正确的做法吗？
【问题讨论】：
-
将js代码放在页面底部。这不是正确的 html 结构
-
您不能一遍又一遍地声明相同的函数（并期望您的按钮调用正确的函数）。您还将相同的
ids 多次放入您的表中，这也不应该以任何方式发生。 -
至于解决方案：将所有数据发送回服务器无论如何都是无稽之谈；您所需要的只是从其按钮中唯一地识别用户。一旦您发送了 id 或电子邮件，您就可以再次从数据库中获取所有其他相关数据。我会在按钮中输入
data-email="<% data[i].EMAIL %>"。在由循环外的单个脚本分配给所有按钮的单击处理程序中，您可以读取this.dataset.email并将其发送到服务器。 -
这是一个非常基本的示例，展示了如何避免大量重复和完全损坏的代码：jsfiddle.net/70smwabv
-
@ChrisG 感谢您的意见。我很欣赏你的做法。我一定会尝试这种方式
标签： javascript html node.js ejs