Question

这是我点击按钮时有动作事件的表格。

<form id="prefForm4" enctype="multipart/form-data" method="post" class="masters"
    action="/Preferences/Preferences/RISSave">
</form>

我有两个按钮，我将根据某些情况显示它们，当显示button1时它将执行表单动作，当button2显示时，它将触发执行不同动作的javascript函数，它不应该触发表单动作，但我的情况是两种方法都在触发。

<input id="button1" name="Save" class="button" type="submit" value="<%="Save".Localize()%>"/>

<input id="button2" name="Save" class="button" type="submit" value="<%="Save".Localize()%>"
                        onclick="saveData();" />

下面的JavaScript

function saveData() {
        $.ajax({
            url: "/Preferences/Preferences/saveData",
            type: "POST",
            data: items,
            success: function (reponse) {
                return true;
            },
            error: function (reponse) {

            }
        });
    }

请帮我解决这个问题。提前谢谢。

Answer 1

将您的第二个按钮类型从submit更改为button这将阻止提交表单。

<input id="button2" name="SavePACS" class="button" type="button" value="<%="SavePACS".Localize()%>"
                    onclick="saveData();" />

Answer 2

你可以这样做：

$('form').on('submit', function(e)
{
    e.preventDefault(); //this prevents default action

    //whatever else you want to do

    $('form').submit()
})

Answer 3

更改调用函数的位置，而不是调用内联函数创建事件侦听器，然后阻止默认操作

$('input[name=SavePACS]').on('click', function(e) {
    e.preventDefault()

    // then do your code here
});

Answer 4

您应该使提交类型的按钮不，以防止它们触发表单提交。

如何防止触发表单提交操作？

4 个答案: