Question

我有这样的情况，我需要跟踪哪个提交按钮点击，以便根据它设置变量。以下是测试代码，

<script>
function submitForm(form) {
    alert(document.getElementById('sb').value);
    if (document.getElementById('sb').value=="One") {
        //Do something
    }
    return true;
}
</script>


<form action="" method="get" onsubmit="return submitForm(this);">
    <input type="submit" name="sb" value="One">
    <input type="submit" name="sb" value="Two">
    <input type="submit" name="sb" value="Three">
</form>

即使我点击按钮Two或Three，警报也会始终显示One。但是url随可点击参数而变化。如何提醒可点击提交按钮中的值？

注意：我想要一个没有JQuery的解决方案

编辑：我更改了onsubmit调用submitForm（this）的代码位; 问题是甚至使用document.forms [0] .sb.value其未定义因为document.forms [0] .sb返回所有提交按钮的节点列表，与document.getElementById（'sb'）

Answer 1

我建议您使用按钮，而不是多个提交按钮。在按钮的onclick属性中，使用javascript提交表单。

Answer 2

你可以这样试试，

    <form>
        <input class="myButton" type="submit" name="sb" value="One">
        <input class="myButton" type="submit" name="sb" value="Two">
        <input class="myButton" type="submit" name="sb" value="Three">
    </form>

    <script type="text/javascript">
        $(".myButton").on('click', function() {
        alert($(this).val());
        });
    </script>

Answer 3

我对javascript有点新鲜;如果我错了，请原谅我。如果您的if语句有第3个=符号，那会不会有所不同？

应该是：

if (document.getElementById('sb').value === "One") {
  //Do something
}
return true;

Answer 4

你可以尝试使用jquery：

$(":submit").live('click', function() {
    alert($(this).val());
})

Answer 5

继续上面的答案：

<script>
function m(value) {
alert(value);
}
</script>

<input type="button" value="One" onClick="m(this.value)">
<input type="button" value="Two" onClick="m(this.value)">
<input type="button" value="Three" onClick="m(this.value)">

你当然可以看到id是什么：

<input type="button" id='myId' value="Three" onClick="m(this.id)">

Answer 6

我认为这是解决此问题的更简单方法。它不需要任何额外的事件。

<script>
function submitForm(form) {
    console.log(document.activeElement.value);
    if (document.activeElement.value == 'One') {
       console.log("Have one.");
       return false;
    }
    return true;
}

</script>


<form action="" method="get" onsubmit="return submitForm(this);">
    <input type="submit" name="sb" value="One">
    <input type="submit" name="sb" value="Two">
    <input type="submit" name="sb" value="Three">
</form>

jsfiddle

我想回答的是表单如何将查询设置为“？sb = {value}”。

Answer 7

这是一个非 jquery 的简单解决方案，用于检测点击了哪个提交按钮。

    <script>
function submitForm(form) {
    console.log(document.getElementById('btn_clicked').value);
    if (document.getElementById('btn_clicked').value === 'One') {
       console.log("Have one.");
       return false;
    }
    return true;
}
</script>

<form action="" method="get" onsubmit="return submitForm(this);" ;">

    <input type="hidden" name="btn_clicked" id="btn_clicked" value="">
    <input type="submit" name="sb" value="One" onclick="document.getElementById('btn_clicked').value='One';">
    <input type="submit" name="sb" value="Two" onclick="document.getElementById('btn_clicked').value='Two';">
</form>

使用多个提交按钮标识单击的提交按钮的值

7 个答案: