Question

这是我的问题。我正在尝试验证表单，并确保在允许表单提交之前用户名可用。我的所有功能都正常工作，包括检查用户名的PHP脚本。但是，我不能阻止表单提交提交。我得到的是我定义的AJAX .error（消息）。 Firebug报告

throw Components.Exception("prompt aborted by user", Cr.NS_ERROR_NOT_AVAILABLE);

但是，当我调用e.preventDefault（）时;在username_exists函数之外，它会停止表单提交，并允许我在上述函数内部进行检查。我完全难过，希望你能帮忙。谢谢。

PS。我甚至不能在该函数中做一个简单的alert（）

$(function(){
    check_username_onsubmit();
});


function check_username_onsubmit(){
    $this = $('#username.registerForm');
    $('form.registerForm').submit(function(e){
        username_exists($this, function(data){
            if(data.found == 1){
                e.preventDefault();
                alert('Username Taken');
            }else{
                alert('Username Free');
            }
        });
        // e.preventDefault();
    });
}


function username_exists($this, callback){
    var username = $this.val();

    $.ajax({
        url : '../includes/Single Scripts/username_exist.php',
        data : {
            username : username 
        },
        type : 'POST',
        dataType : 'json',
        success : function(data){
            callback(data);
        }
    }).error(function(){
            alert('An error has occured');
    });
}

Answer 1

我会移除<input type="submit">并在<button id="send">之后添加</form>。

然后，执行以下操作：

$('#send').on('click', function () {
    var uname = $('#username.registerForm').val();
    username_exists(uname, function (data) {
        if (data.found == 1) {
            alert('Username Taken');
        } else {
            alert('Username Free');
            $('form.registerForm').submit();
        }
    });
});

编辑：另外：

function username_exists(username, callback) {
    $.ajax({
        url: '../includes/Single%20Scripts/username_exist.php',
        data: {
            'username': username
        },
        type: 'POST',
        dataType: 'json',
        success: function (data) {
            callback(data);
        }
    }).error(function () {
        alert('An error has occured');
    });
}

Answer 2

提交，按照其设计离开页面。 AJAX，它的设计并没有离开页面。

如果要在将表单发送到服务器之前使用JavaScript来验证表单，请删除提交按钮。单击时触发客户端验证脚本，如果通过，则执行AJAX调用。

$('#someForm').on('click','#myButton', {}, aValidationFunctionToCall);

aValidationFunctionToCall : function (event) {
    // validate stuff
    // show the user the error of their ways
    // or call your ajax
}

Answer 3

在check_username_onsubmit()中

投入return false;，它将阻止表单提交。

如果您已经知道，请开始检查以确保将javascript方法正确附加到提交事件或提交点击事件。该功能可能甚至没有被调用。

如果表单提交，为什么我不能处理我的ajax函数？

3 个答案: