如何解决从在数组循环上生成的表单提交文本输入中获取值?
我正在创建一个 Chrome 扩展程序,其中包含在我的 popup.js 文件中的数组循环中生成的卡片轮播。
popup.html
<div class="container pt-4">
<div id="carouselExampleControls" class="carousel slide" data-interval="false">
<div class="carousel-inner" id="carousel-products"></div>
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
popup.js
anuncios.forEach((anuncio,index) => {
if (index == 0){
htmlString += "<div class='carousel-item active'>"
} else {
htmlString += "<div class='carousel-item'>"
}
htmlString += "<div class='container'>"
htmlString += "<div class='card'>"
htmlString += '<ul class="list-group">';
htmlString += '<li class="list-group-item d-flex justify-content-between align-items-center font-weight-bold">';
htmlString += 'GASTOS DIVERSOS';
htmlString += `<form action="#" id="gastosDiversosForm-${index}" ">`+
`<input type="number" name="submit" id="gastosDiversosInput-${index}"/>`+
`<input type="hidden" name="id" value="${index}">`+
'</form>';
htmlString += '</li>';
htmlString += "</div>";
htmlString += "</div>";
htmlString += "</div>";
}
document.getElementById("carousel-products").innerHTML = htmlString;
生成的代码: Generated code
在每张卡片里面我会有一个输入字段,它的值应该更新卡片上的一个字段。
如何在不知道表单 ID 的情况下动态更新值,因为它们是在循环中生成的?
我知道我可以做这样的事情:
window.onload = function() {
document.getElementById('gastosDiversosInput-0').onsubmit = function() {
return false;
}
}
但是,由于我无法在 Chrome 扩展程序上使用内联脚本,我如何预测要提交的表单的唯一 ID?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。