以HTML形式使用Javascript

Question

我正在尝试获取html表单以从javascript代码中获取值。 我想要隐藏字段“ SubID”来获取javascript函数的值。 这是我到目前为止所拥有的..我在做什么错：

<form action="" method="post">
<fieldset><input name="firstname" type="text" placeholder="First Name" /></fieldset>
<input type="hidden" name="SubID" value="uid1">
<fieldset><button id="contact-submit" name="submit" type="submit" data-submit="...Sending">Submit</button></fieldset>

<script type="text/javascript">
  function getCookie(name)
  {
    var re = new RegExp(name + "=([^;]+)");
    var value = re.exec(document.cookie);
    return (value != null) ? unescape(value[1]) : null;
  }
  var uid1 = document.write(getCookie("uid"));
</script>

Answer 1

将侦听器添加到表单的Submit事件：

// declare listener
function handleSubmit() {
    var myHiddenInput = document.querySelector('[name=SubID]');
    myHiddenInput.value = getCookie("uid");
}
// hook listener to the event of the form
var myForm = document.querySelector('form');
myForm.addEventListener("submit", handleSubmit, false);

这应该可以在最新的浏览器中使用。 如果您需要支持较旧的浏览器，则.addEventListener()会发生一些变化。

有关如何在此处添加简单事件侦听器的更多信息 。

JSBin或以下版本的演示：

 function getCookie(name) { var re = new RegExp(name + "=([^;]+)"); var value = re.exec(document.cookie); return (value != null) ? unescape(value[1]) : null; } //var uid1 = document.write(getCookie("uid")); var myForm = document.querySelector('form'); function handleSubmit() { var myHiddenInput = document.querySelector('[name=SubID]'); // myHiddenInput.value = getCookie("uid"); myHiddenInput.value = "test -- have a look at the network tab to check if this was submitted"; } myForm.addEventListener("submit", handleSubmit, false); 

 <form action="https://httpbin.org/post" method="post"> <fieldset><input name="firstname" type="text" placeholder="First Name" /></fieldset> <input type="hidden" name="SubID" value="uid1"> <fieldset> <button id="contact-submit" name="submit" type="submit" data-submit="...Sending">Submit</button> </fieldset> </form>