Question

我在http://docs.jquery.com/Plugins/Validation/validate

使用jQuery和validate插件

我想阻止表单在通过ajax完成验证和提交过程后提交。我有以下代码：

$("#myform").validate({
   rules: {...},
   submitHandler: function(form) { 
      alert("Do some stuff...");
      //submit via ajax
      return false;  //This doesn't prevent the form from submitting.
   }
});

然而，问题是即使我在处理函数的最后一行有submitHandler语句，return false;也会提交表单。我想要阻止默认行为并停止提交表单，因为我已经通过ajax提交了。

在通过submitHandler函数中的ajax代码后，如何阻止代码提交？

Answer 1

我是这样做的，它完全按照你希望的方式工作：

$("#myform").submit(function(e) {
    e.preventDefault();
}).validate({
    rules: {...},
    submitHandler: function(form) { 
        alert("Do some stuff...");
        //submit via ajax
        return false;  //This doesn't prevent the form from submitting.
    }
});

Answer 2

$("#myform").validate({
   rules: {...},
   submitHandler: function(form, event) { 
      event.preventDefault();
      alert("Do some stuff...");
      //submit via ajax
   }
});

希望得到这个帮助。

Answer 3

也许您可以在不使用提交按钮的情况下进行外部验证：

if($("#myform").valid()){
    alert("Do some stuff...");
}

Answer 4

您可以在event.preventDefault()事件中致电submit：

$("#myform").on("submit", function(event) {
    event.preventDefault();
});

Answer 5

您可以通过＆＃34; jQuery Walidate＆＃34;以非常简单的方式对此进行编码。 http://jquery.dop-trois.org/walidate/

在那里你可以编写一个函数，它将在提交时执行。在文档中查找回调。

Answer 6

不幸的是，似乎调用：submitHandler: function(form){没有采用事件参数，因此似乎唯一的解决方案是这样的return false语句：

...
submitHandler: function(form) {
    //your code
    return false;
},
...

Answer 7

工作fiddle

根据jquery插件验证文档。

submitHandler（默认值：本机表单提交）

下面通过documentation引用了通过submitHandler提交的方法，该方法应该有效，但实际上他们说的不起作用

用于在表单有效时处理实际提交的回调。获取form和submit event作为唯一参数。替换默认的提交。验证后通过Ajax提交表单的正确位置。

示例：有效时，使用jQuery Form插件通过Ajax提交表单。

$("#myform").validate({   
   submitHandler: function(form,event) {
     event.preventDefault();
      $(form).ajaxSubmit();   
   } 
});

我在这里编写对我有用的代码。只需调用您的validayion插件，并且在验证函数参数中不要包含submitHandler。

不是使用submitHandler进行提交和阻止，而是使用jQuery提交表单的方法。像下面一样

$("form").validate({});

$(document).on("submit", "form", function (event) {
   event.preventDefault();
   alert("submit"); 
});

Answer 8

我这样固定。 jQuery验证插件错误的补丁，即使在v1.19.0上也无法修复

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):

        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(400, 300)
        self.centralWidget = QtWidgets.QWidget(MainWindow)
        self.centralWidget.setObjectName("centralWidget")

        self.horizontalLayout_2 = QtWidgets.QHBoxLayout(self.centralWidget)

        self.horizontalLayout_2.setContentsMargins(11, 11, 11, 11)
        self.horizontalLayout_2.setSpacing(6)
        self.horizontalLayout_2.setObjectName("horizontalLayout_2")
        self.horizontalLayout = QtWidgets.QHBoxLayout()
        self.horizontalLayout.setSpacing(6)
        self.horizontalLayout.setObjectName("horizontalLayout")
        self.start_button = QtWidgets.QPushButton(self.centralWidget)
        self.start_button.setObjectName("start_button")

        self.horizontalLayout.addWidget(self.start_button)
        self.stop_button = QtWidgets.QPushButton(self.centralWidget)
        self.stop_button.setObjectName("stop_button")
        self.horizontalLayout.addWidget(self.stop_button)
        self.horizontalLayout_2.addLayout(self.horizontalLayout)
        MainWindow.setCentralWidget(self.centralWidget)
        self.menuBar = QtWidgets.QMenuBar(MainWindow)
        self.menuBar.setGeometry(QtCore.QRect(0, 0, 400, 26))
        self.menuBar.setObjectName("menuBar")
        MainWindow.setMenuBar(self.menuBar)
        self.mainToolBar = QtWidgets.QToolBar(MainWindow)
        self.mainToolBar.setObjectName("mainToolBar")
        MainWindow.addToolBar(QtCore.Qt.TopToolBarArea, self.mainToolBar)
        self.statusBar = QtWidgets.QStatusBar(MainWindow)
        self.statusBar.setObjectName("statusBar")
        MainWindow.setStatusBar(self.statusBar)

        self.retranslateUi(MainWindow)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
        self.start_button.setText(_translate("MainWindow", "Start"))
        self.stop_button.setText(_translate("MainWindow", "Stop"))


class MyWindow(QtWidgets.QMainWindow, Ui_MainWindow):
    def __init__(self):
        super().__init__()

        self.setupUi(self)


stylesheet = """
    QMainWindow {
        background-image: url("D:/_Qt/img/cat.jpg"); 
        background-repeat: no-repeat; 
        background-position: center;
    }
"""

if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    app.setStyleSheet(stylesheet)

    w = MyWindow()
#   MainWindow = QtWidgets.QMainWindow()
#   ui = Ui_MainWindow()
#   ui.setupUi(MainWindow)
#   MainWindow.show()
    w.show()

    sys.exit(app.exec_())

防止表单在jQuery Validate插件的submitHandler函数中提交

8 个答案: