正在跳过Ajax调用

Ajax call being skipped

本文关键字:Ajax 调用      更新时间:2024-02-04

下面的javascript出现问题,其中没有调用$.ajax调用。alert('foo')确实发生了,但随后数据调用被完全跳过,并且从未到达回调(永远不要得到alert('success!')。我不完全理解回调,但这似乎应该起作用。

编辑

把剧本编辑到我现在的位置,因为我读过这种方式是更好的练习。尽管如此,我仍然可以进入authenticate(),它在url:[...]上中断,但从未真正进行ajax调用。我试着删除返回只是想看看这是否是问题所在,但它产生了相同的结果。

define(["jQuery", "kendo", "modernizr", "app/environment"], function ($, kendo, modernizr, environment) {
    var authenticate = function (username, password) {
        return $.ajax({
            url: environment.apiConnection + '/canlogin?userid=' + username + '&password=' + password,
            type: 'get',
            dataType: 'jsonp'
        });
    }
    var canLogin = function(data) {
        alert('good');
    }
    return {
        viewModel: kendo.observable({
            username: null,
            password: null,
            authenticate: function () {
                var username = this.get('username'),
                    password = this.get('password');
                authenticate(username, password).done(canLogin);
            }
        })
    }
});

改为使用回调。

var canLogin = function (username, password, callback) {
    $.ajax({
        async: false,
        url: config.apiConnection + '/canlogin?userid=' + username + '&password=' + password,
        type: 'GET',
        dataType: 'jsonp',
        error: function (x, t, r) {
            alert('Error');
        },
        success: callback
    });
}
// use
canLogin("user","passwd",function( data ){
    alert("Im called on authentication success!");
});

该解决方案混合了e.preventDefault()和在ajax调用中使用回调。仅仅使用回调并不能解决问题,但将preventDefault添加到authenticate函数并修复回调问题确实解决了问题。

最终的工作版本,现在看起来像这样:

define(["jQuery", "kendo", "modernizr", "app/environment"], function ($, kendo, modernizr, environment) {
    function authenticate(username, password, callback) {
        $.ajax({
            url: environment.apiConnection + '/canlogin?userid=' + username + '&password=' + password,
            type: 'get',
            dataType: 'jsonp',
            success: callback,
            error: function (x,t,r) {
                console.log('error')
            }
        });
    }
    function login(canLogin, username, password) {
        if (canLogin == false) {
            alert('Incorrect username or password');
            return;
        }
        alert('good');
    }
    return {
        viewModel: kendo.observable({
            username: null,
            password: null,
            authenticate: function (e) {
                e.preventDefault();
                var username = this.get('username'),
                    password = this.get('password');
                authenticate(username, password, function (canLogin) {
                    login(canLogin, username, password);
                });
            }
        })
    }
});