从 javascript 访问具有相同名称的 HTML 表单元素答案

【问题标题】：Accessing HTML form elements with same name from javascript从 javascript 访问具有相同名称的 HTML 表单元素
【发布时间】：2013-03-27 16:21:31
【问题描述】：

我正在使用以下多个提交按钮的解决方案 (How to best implement Save | Save and Close | Cancel form actions in ASP.NET MVC 3 RC) 以允许从我的 MVC 表单中取消和保存：

<form action="Xxxx" method="post" onsubmit="return validatePost()">
...
<input type="submit" name="actionType" value="Save" />
<input type="submit" name="actionType" value="Cancel" />
</form>

使用 javascript 调用 onsubmit：

function validatePost() {
    if(Blah blah){
        return true;
    }
}

我只想在单击“保存”时执行此 javascript 验证，但无法判断从 javascript 中单击了哪个按钮。

我尝试使用document.forms[0].elements["actionType"].value 获取actionType 值，但未能成功，因为表单上有多个名为actionType 的项目。

谁能帮忙？

谢谢

【问题讨论】：

标签： javascript forms asp.net-mvc-4

【解决方案1】：

您可以使用id (http://jsfiddle.net/7p5N5/)

<form method="post">
<input id="save" type="submit" name="actionType" value="Save" />
<input type="submit" name="actionType" value="Cancel" />
</form>

function validate() {
    alert('Validate');
    return false; // cancel click, true will submit
}

$("#save").click(function () {
    return validate();
});

如果不想使用id，可以使用$('input[name="actionType"][value="Save"]')选择保存按钮

【讨论】：

啊，一看就觉得很简单——我用的是id。感谢您的帮助

【解决方案2】：

您是否能够仅收听“保存”输入的 onclick 事件并让它使用您的 validatePost 函数。

然后你可以有一个不同的功能来点击“取消”来做适当的动作。

【讨论】：