禁用jquery移动表单按钮操作[重复]

Question

可能重复：
AJAX Form Submission in jQuery Mobile

我有一个表单，我使用 jQuery 来检查和验证表单，这样，如果表单为空，它不会提交表单，只会提示“请填写所有字段”。

function doShowError( eForm, sField, iInd, sError ) {
    var $Field = $( "[name='" + sField + "']", eForm ); // single (system) field
    if( !$Field.length ) // couple field
        $Field = $( "[name='" + sField + '[' + iInd + ']' + "']", eForm );
    if( !$Field.length ) // couple multi-select
        $Field = $( "[name='" + sField + '[' + iInd + '][]' + "']", eForm );
    if( !$Field.length ) // couple range (two fields)
        $Field = $( "[name='" + sField + '[' + iInd + '][0]' + "'],[name='" + sField + '[' + iInd + '][1]' + "']", eForm );

    //alert( sField + ' ' + $Field.length );

    $Field.parents('div:first').addClass( 'error' );

    $Field
    .parents('div:first')
        .addClass( 'error' )
        .children( 'img.warn' )
            .attr('float_info', sError)
            //.show()
            ;
}

现在的问题是，每当我点击提交按钮时，我都会被重定向到页面（应该是用户面板），其中只有一条文字：

未定义

如何禁用 jQuery 按钮默认的功能？

编辑： 我的事件触发并且消息显示，但我仍然被重定向到表单属性action 中定义的 URL。

Answer 1

在验证表单字段的函数中（应在submit 事件上调用），如果验证成功，则需要返回true，否则返回false。

这样可以防止表单在验证失败时导航到action属性中定义的URL。

你可以试试这样的：

$(function() {
    $("#your_form").submit(function() {
        // Define `sField`
        var sField = // SOMETHING

        // Define `iInd`
        var iInd = // SOMETHING

        // Define `sError`
        var sError = // SOMETHING

        return doShowError($(this), sField, iInd, sError);
    });
});

其中#your_form 是表单的ID，doShowError() 是验证表单输入的函数，如果所有字段都正常，则返回true，反之则返回else。

在这种情况下，您可能需要修改您的函数doShowError，使其返回true 或false，如上所述。你可以把它改成这样：

function doShowError( eForm, sField, iInd, sError ) {

    // `haserror`: boolean output which will equal `true` 
    // if all the fields are correct, and `else` otherwise
    var haserror = true;

    var $Field = $( "[name='" + sField + "']", eForm ); // single (system) field
    if( !$Field.length ) { // couple field
        $Field = $( "[name='" + sField + '[' + iInd + ']' + "']", eForm );
        haserror = false;
    }
    if( !$Field.length ) { // couple multi-select
        $Field = $( "[name='" + sField + '[' + iInd + '][]' + "']", eForm );
        haserror = false;
    }
    if( !$Field.length ) { // couple range (two fields)
        $Field = $( "[name='" + sField + '[' + iInd + '][0]' + "'],[name='" + sField + '[' + iInd + '][1]' + "']", eForm );
        haserror = false;
    }

    //alert( sField + ' ' + $Field.length );

    $Field.parents('div:first').addClass( 'error' );

    $Field.parents('div:first')
        .addClass( 'error' )
        .children( 'img.warn' )
            .attr('float_info', sError)
            //.show()
            ;

    return haserror;
}