Question

我是Javascript的新手，无法找到问题的答案。我有很多页面设置完全相同，每个页面上都有一个表单和按钮。当用户单击提交按钮时，我希望javascript设置隐藏输入的值。我完成了这个工作，直到我设置了第二页。单击提交按钮时，第二页需要添加不同的值。但只有我的javascript中的最后一个值正在运行。它没有识别第一个值。我相信如果我在每个提交按钮上更改了Id，这将很容易修复，但由于我有其他代码，这将导致数小时的工作。

<script language="javascript" type="text/javascript">
<!--

window.onload=function() {document.getElementById("atc").onclick=function() 
{document.forms[0].autosccartprice.value = "40.00";
document.forms[0].fwbcartprice.value = "118.00";
}}

//-->
</script>

这是我第一页上的html，效果很好。

<form action="https://www.mywebsite.com" method="post" 
class="buttonform">
<input type="hidden" name="price" id="fwbcartprice" value="" /><br />
<input type="submit" value="" class="addtocart3" id="atc" title="Add To Cart">
</form>

这是第二页上的html，它不起作用

<form action="https://www.mywebsite.com" method="post" 
class="buttonform">
<input type="hidden" name="price" id="autosccartprice" value="" /><br />
<input type="submit" value="" class="addtocart3" id="atc" title="Add To Cart">
</form>

Answer 1

您似乎正在尝试填写隐藏的输入，但表单已经提交。因此，首先您需要暂停表单提交，填写隐藏字段，然后重新提交表单。

试试这段代码：

window.addEventListener("load", function() {
   document.getElementsByClassName("buttonform")[0].addEventListener("submit", function(e) {
     e.preventDefault();
     this.autosccartprice.value = "40.00";
     this.fwbcartprice.value = "118.00";
     this.submit();
   }
}

Ps：如果您为每个表单添加一个唯一的ID，然后使用getElementById()方法而不是document.forms[i]选择每个表单，那会更好。

onclick更改多个表单输入值

1 个答案: