javascript - 通过javascript编辑html输入表单的值

Question

我的 HTML 代码:

<form action="Generator.klx" method="post" onsubmit="genarate('hiddenField')">
   <input type="hidden" id="hiddenField" name="hidden" value=""/>
   <input type="submit" name="submit"/>
</form>

我的 JavaScript:

function genarate(hiddenField){
  var field = document.getElementById(hiddenField);
  field.value = "new Value";
 }

但它就是行不通:(。谁能告诉我哪里错了？
谢谢

Answer 1

您引用的代码应该可以工作，并且在我对各种浏览器的测试中确实如此。 (我已经在本地尝试过，使用 POSTed 表单，但您也可以在这里尝试:http://jsbin.com/ehoro4/1 我已将方法更改为 GET 以便您可以在 URL 中看到结果。)

我的猜测是您在页面上有 else 的 name 或 id “hiddenField”，而不仅仅是隐藏字段你引用了。如果您将字段名称更改为“fluglehorn”或其他(嗯)不太可能出现在您页面其他地方的名称，它可能会很好地工作。这是因为 getElementById 使用的命名空间(遗憾的是)非常拥挤。

或者，您确定 genarate 出现在全局范围内吗？ (例如，它在所有其他函数之外。)因为您的 onsubmit 属性要求 genarate 是全局的。所以这有效:

<form action="#" method="get" onsubmit="genarate('hiddenField')">
   <input type="hidden" id="hiddenField" name="hidden" value=""/>
   <input type="submit" name="submit"/>
</form>
<script>
function genarate(hiddenField){
  var field = document.getElementById(hiddenField);
  field.value = "new Value";
}
</script>

但例如这不会:

<form action="#" method="get" onsubmit="genarate('hiddenField')">
   <input type="hidden" id="hiddenField" name="hidden" value=""/>
   <input type="submit" name="submit"/>
</form>
<script>
(function() { // Begin scoping function to avoid global symbols (not uncommon)
    function genarate(hiddenField){
      var field = document.getElementById(hiddenField);
      field.value = "new Value";
    }
})();
</script>

还建议使用调试器(这里有 no excuse，表示 2011 年不使用客户端调试器)在 genarate 函数上设置断点并遍历，看看出了什么问题。