【发布时间】：2011-04-02 02:09:16
【问题描述】：
当您在一个表单中有多个提交按钮时，有没有一种方法可以知道是哪个按钮触发了onsubmit 事件，而无需向按钮本身添加代码？
编辑：我需要在客户端进行检查，即使用 JavaScript。
【问题讨论】：
标签： javascript dom-events dhtml
【发布时间】：2011-04-02 02:09:16
【问题描述】：
我能想到几种方法。
您可以使用不同的值，而您的不显眼的 javascript 可以提供帮助。
这里有一个关于这种方法的讨论（对每个按钮使用不同的值）：
http://www.chami.com/tips/internet/042599I.html
我倾向于为每个按钮使用不同的name 属性。
关于这方面的博客在这里：http://www.codetoad.com/javascript/multiple.asp
我不遵循这两种方法，哪种方法最有效取决于不同的因素，例如，您是在 javascript 中处理提交按钮，还是服务器会获取表单，然后必须弄清楚用户想要什么。
就个人而言，我现在更喜欢使用 ajax 方法，我只是在页面加载后将事件附加到按钮，使用不显眼的 javascript，然后根据用户选择调用正确的函数，但这取决于关于是否可以将脚本链接添加到 html 页面。
更新：
为了用javascript做到这一点，最简单的方法是在点击按钮时附加一个事件，然后看名字来决定如何处理。
实际上，表单从来没有真正必须提交到服务器，但是您可以通过包装参数（选项）并将它们发送到服务器来在后台处理所有事情，并让用户知道结果。
【讨论】：
-
是的，不同的名字是要走的路。基于值的检查在概念上是错误的，因为这些值是 GUI 的一部分。
“提交”事件不是由按钮触发的，而是由“表单”触发的。快速测试证明了这一点：
<form id="myform">
<input id="email" type="text" value="1st Email" />
<input id="action1" type="submit" value="Action 1" />
<input id="action2" type="submit" value="Action 2" />
</form>
<script type="text/javascript">
document.getElementById("myform").onsubmit = function(evt) {
var event = evt || window.event;
alert(event.target.id); // myform
alert(event.explicitOriginalTarget.id); // action2 (if action2 was clicked)
// but only works in firefox!
}
</script>
虽然在 Firefox 中，您可以使用事件上的event.explicitOriginalTarget 属性来获取被点击的输入（提交），从而触发提交事件。 （如果你想知道）
所以对你来说最好的选择是：
- 为您的提交按钮设置不同的值或
- 将它们作为普通按钮并通过 javascript 处理它们的单击处理程序。
【讨论】：
-
谢谢。我想到了 onclick 处理程序。似乎没有干净的方法（至少不是跨浏览器）
-
我真的很惊讶这个功能是可用的，但是在遇到这个问题（以及几个类似的问题）之后，看起来它只是不存在。跛脚。
每个按钮上都有一个事件监听器算作添加代码吗？否则，无法查看是哪个按钮触发了提交事件，除非您想在事件期间蹲下来并计算鼠标位置并将其与按钮位置进行比较。
否则，下一个最好的办法是为按钮的单击事件分配一个事件处理程序，并将该按钮的名称分配给一个可以在表单的提交事件中检查的变量。
【讨论】：
-
我害怕那个。真可惜。
很抱歉让这个非常古老的线程热身。此处未回答此问题，但之前仅提供了实用解决方法。
但事件对象确实携带有关哪个对象启动它的信息。在处理程序 b4submit(e) 中，您可以像这样获得提交按钮：
function b4submit(e) {
var but = e.originalEvent.explicitOriginalTarget;
...
}
而且 but 是一个 HTML 对象，具有您为其分配的所有属性，例如名称、id、值等。
经过一些调试后我发现了这个问题，我认为它作为一个干净的解决方案可能会引起更广泛的兴趣。
【讨论】：
-
接受的答案已经提到
explicitOriginalTarget。这是 Mozilla 特有的属性。