1

我有一个带有多个提交按钮的表单，其中一个是重新加载按钮，这证明很难编码。

这个想法是，当用户单击“重新加载”时，表单被提交，并根据选择字段的值进行更新。该位的代码片段很简单（简化为基础）：

<select type="text" id="dataamount" size="1">
    <option value="time0h10m">Latest 10 minutes</option>
    <option value="time1h00m">Latest 1 hour</option>
    <option value="time12h00m">Latest 12 hours</option>
</select>
<input type="submit" id="btnreload" value="reload latest data">
<input type="submit" id="btndelete" value="delete all">
<input type="submit" id="btnrun" value="run">

然后我想，如果用户更改了“重新加载”字段值，那么无论如何都应该通过“重新加载”按钮触发提交。（为什么要强制他们更改然后单击，= 2 个操作？当 dataamount -> onchange 发生时自动触发提交要好得多。）但是我必须指定哪个提交按钮，而不仅仅是提交表单。那就是问题所在。

我想做这样的事情，但我认为这不起作用或不可靠：

<select type="text" id="dataamount" size="1" 
         onchange="document.getElementById('btnreload').submit();">
etc

or              "..... ('btnreload').click();

但我找不到任何指南来执行此操作，或提供我拥有的选项。偶尔会有一些提示，提交字段的 click() 可能得不到很好的支持，或者提交字段不能总是使用 .submit() 来执行。

我追求良好的兼容性并使用纯javascript（没有jquery等）。理想情况下，我希望将其保持内联并尽可能避免（启用/禁用 + form.submit()）解决方法（提交按钮可能会更改或变为动态）。

4

3 回答 3

1

用这个：

<select type="text" id="dataamount" size="1" 
         onchange="myFunction();">

 function myFunction() {
        document.querySelectorAll("input[type=submit]")[0].click();
    }
于 2014-09-17T07:56:49.150 回答
0

首先，您必须为要提交到服务器的任何数据提供您的select和input元素属性。name

其次，向表单添加一个隐藏的输入，并在select onchange事件中将其值设置为您可以在服务器端代码中检查的内容，然后提交表单：

document.getElementById("hiddenInputId").value = "dataAmountChanged";
document.forms[0].submit();
于 2013-04-03T01:58:49.557 回答
0

采用 ：

 document.querySelectorAll("input[type=submit]")[0].click();
于 2014-09-17T06:48:55.720 回答