表单提交遗漏了一个值

时间:2012-06-18 20:57:51

标签: php javascript forms google-chrome submit

如果通过Chrome v19中的javascript提交,我的submit按钮的值就会丢失。它适用于IE8,IE9和FF12。我有以下页面显示问题:

<html>
<head>
<script type="text/javascript">
    function submitorder()
    {
        document.openord.TYPE.value='Submitted using javascript';
        document.openord.submit();
    }
</script>
</head>

<body>
<pre>
The contents of $_REQUEST are:
<?php var_dump($_REQUEST); ?>
</pre>

<form method="post" action="showParms.php" name="openord">
    <input type="hidden" name="TYPE" value="Submitted the regular ol' way">
    <input type="hidden" name="NAME" value="Frederick Q. Larson">
    <input type="submit" name="TASK" value="Submit with Javascript" onclick='submitorder();'>
    <input type="submit" name="TASK" value="Normal Submit">
</form>
</body>
</html>

点击“正常提交”,您会看到TASK的值,如下所示:

The contents of $_REQUEST are:
array(3) {
  ["TYPE"]=>
  string(29) "Submitted the regular ol' way"
  ["NAME"]=>
  string(19) "Frederick Q. Larson"
  ["TASK"]=>
  string(13) "Normal Submit"
}

使用“使用Javascript提交”按钮不是这样:

The contents of $_REQUEST are:
array(2) {
  ["TYPE"]=>
  string(26) "Submitted using javascript"
  ["NAME"]=>
  string(19) "Frederick Q. Larson"
}

在IE和FF中,点击“使用Javascript提交”时,您会看到:

The contents of $_REQUEST are:
array(3) {
  ["TYPE"]=>
  string(26) "Submitted using javascript"
  ["NAME"]=>
  string(19) "Frederick Q. Larson"
  ["TASK"]=>
  string(22) "Submit with Javascript"
}

知道Chrome出现问题的原因是什么?

2 个答案:

答案 0 :(得分:3)

如果您只想提交带有通过JavaScript更改的参数的表单,那么

function submitorder() {
    document.openord.TYPE.value='Submitted using javascript';
}

就足够了,因为当用户点击提交按钮时,表单会自动提交。

“纠正”行为

根据Specification,“4.10.22.4构建表单数据集”部分:

  

可选地在提交者提交者的上下文中为表单表单构造表单数据集的算法如下。如果没有另外指定,提交者为空   . . .
  3. 循环:对于控件中的每个元素字段,按树顺序运行以下子步骤:
  1.如果满足以下任何条件,则跳过此元素的这些子步骤:
  . . .
  •field元素是一个按钮,但它不是提交者。

提交表单时使用此算法(specification reference) 显然,由于没有点击任何按钮,提交者为空,因此没有提交元素。

在Firefox中,启动提交表单的功能的按钮似乎被标记为 submitter 。在没有(表单提交)按钮的情况下调用该函数会显示与Chrome中相同的行为:http://jsfiddle.net/3fwcr/1/

event.preventDefault();添加到按钮的click事件后,表单也会像在Chrome中一样提交:http://jsfiddle.net/3fwcr/2/
显然,Firefox的默认提交仍然被触发,即使表单已经提交(似乎违反规范:“如果表单已经提交(..),则中止这些步骤”(“这些步骤”=表单提交))。

答案 1 :(得分:0)

我认为这不是问题/错误,只是因为您使用JavaScript进行提交。您可以添加如下代码:

var hiddenVal = document.createChild("input");
hiddenVal.setProperty("name", "TASK");
hiddenVal.setProperty("type", "hidden");
hiddenVal.setProperty("value", Submit with JavaScript");
document.openord.appendChild(hiddenVal);