Question

我的脚本javascript有问题。我有一个内部函数和变量的对象。在其中一个函数中，我发出一个ajax请求，在错误处理程序中，我调用在同一个对象中定义的函数，但是调试器说该函数是＆＃34;不可用＆＃34;但是对象中定义的变量是可见的......

这是带有对象的Javascript部分：

Utils = {
"defaultErrorMessage" : "Ci scusiamo per il disagio ma qualcosa è andato storto, probabilmente è una cosa temporanea, ritenta in un altro momento",
"base_url" : $('#base_url').val(),
getApiUri : function(name) {
    return window.location.protocol + "//" + window.location.host + PATH[ENV] + name + ENV == 'stub' ? '.json' : '';
},

callServer : function(uri, data, successCallback) {
    $.ajax({
        type: "POST",
        url: this.base_url + "index.php/" + uri,
        data: data,
        dataType: "json",
        cache: false,
        beforeSend: function(XMLHttpRequest)
        {
            waitingDialog.show('Caricamento...');
        },
        success:
            function (data) {

                //alert(data);  //as a debugging message.
                successCallback(data);
            },
        error: function (xhr, ajaxOptions, thrownError) {
            //alert("Qualcosa di storto: "+ xhr.status + " messaggio: " + xhr.responseText);
            this.showModalDialog('error','Siamo spiacenti :(', this.defaultErrorMessage);
        },
        complete: function() {
            waitingDialog.hide();
        }
    });
},

hideAllMessages: function ()
{
    var messagesHeights = new Array(); // this array will store height for each

    for (i=0; i<myMessages.length; i++)
    {
        messagesHeights[i] = $('.' + myMessages[i]).outerHeight();
        $('.' + myMessages[i]).css('top', -messagesHeights[i]); //move element outside viewport
    }
},

showMessage: function(type, title, message) {
    var title = (typeof title !== 'undefined') ? title : '';
    var message = (typeof message !== 'undefined') ? message : '';

    this.hideAllMessages();
    if (title != '')
        $('.'+type + ' h3').html(title);
    if (message != '')
        $('.'+type + ' p').html(message);
    $('.'+type).animate({top:"0"}, 500);
},

showModalDialog: function(type, title, message, withOK) {
    var withOK = (typeof withOK !== 'undefined') ? withOK : false;
    $div = $('<div id="error" title="'+title+'">');
    $div.append('<p>'+message+'</p>');
    if (!withOK) {
        $div.dialog({
            modal: true,
            maxHeight: 500
        }).prev(".ui-dialog-titlebar").css("background", colorDialog[type]);
    }
    else {
        $div.dialog({
            modal: true,
            maxHeight: 500,
            buttons: {
                Ok: function() {
                    $( this ).dialog( "close" );
                }
            }
        }).prev(".ui-dialog-titlebar").css("background", colorDialog[type]);
    }
},

validateEmail: function(email) {
    var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email);
}

};

为什么 this.showModalDialog 在错误处理程序中不可用？我也试过没有＆＃34;这个＆＃34;但是是一样的......

Answer 1

this并不总是在回调函数中起作用，因为上下文发生了变化，因此this指的是不再是Utils对象的内容。解决这个问题的方法是保留一个变量，以便在需要时记住上下文。在callServer函数中，在ajax调用之前添加var self = this。然后，当您需要引用showModalDialog时，可以使用self.showModalDialog();

调用它

callServer : function(uri, data, successCallback) {
     var self = this;
     $.ajax({
       ...
          self.showModalDialog();

Answer 2

问题是this代表callServer中的对象，但它在您传递给Ajax调用的函数中没有相同的含义，而是表示您传递给$.ajax()作为参数的对象。

您需要将其作为另一个变量传递，例如self。

内部callServer

var self = this;

在你的错误处理程序里面

self.showModalDialog();

Javascript调用函数不可用

2 个答案: