2

尽管将上下文设置为“this”，但无法触发预期的方法。在 createNewTable 函数中的以下代码中，“this.joinTable(data.tableId);” 尽管将上下文设置为此，但无法触发。

我如何解决这个问题。请帮忙。

var homePageKeycontroller = {

    currentIndex:0,
    tables: new Array("newGame"),

    init: function(){
        this.select();
    },

    select : function(){
        $(".box").css({
            background:"#FFAB25"
        });
        $("#"+this.tables[this.currentIndex]).css({
            background:"gray"
        });
    },
    next : function(){
        this.currentIndex++;
        if(this.currentIndex > this.tables.length-1)
            this.currentIndex = 0;
        this.select();
    },
    previous : function(){
        this.currentIndex--;
        if(this.currentIndex <= 0)
            this.currentIndex = 0;
        this.select();
    },
    createNewTable : function(){
        $.ajax({
            url: "http://mywebiste.com/createAjaxTable",
            type:'post',
            dataType:'json',
            context:this,
            success:function(data){
                if(data.status == JsonStatus.OK){
                    alert("Table ID: "+data.tableId);
                    this.joinTable(data.tableId); // issue here
                }
            }
        });
    },
    handleUserChoice : function(){
        if(this.tables[this.currentIndex] ==='newGame'){
            this.createNewTable();
        }
    },
    joinTable : function(_tId){
        $.ajax({
            url:"http://mywebsite.com/JoinTable",
            type:'post',
            dataType:'json',
            data:{tableId:_tId},
            context:this,
            success:function(data){
                if(data.status == JsonStatus.OK){
                    this.showTable(); //issue here
                }
            }
        });
    },
    showTable : function(){
        $.ajax({
            url : 'http://mywebsite.com/showTable',
            success:function(data){
                DOM.mainCanvas.html(data);
            }
        });
    }
}
4

3 回答 3

2

根据 jQuery API 文档

所有回调中的this引用是设置中传递给$.ajax的context选项中的对象；如果未指定上下文，则这是对 Ajax 设置本身的引用。

因此，要使其正常工作，您可以在 ajax 调用之前将对此的引用存储在变量中，或者直接在回调中调用 homePageKeyController.joinTable()：

createNewTable : function(){
    var self = this;
    $.ajax({
        url: "http://mywebiste.com/createAjaxTable",
        type:'post',
        dataType:'json',
        context:this,
        success:function(data){
            if(data.status == JsonStatus.OK){
                // Use self variable here since "this" belongs to callback
                // function context.
                // or call homePageKeyController.joinTable(data.tableId) instead.
                self.joinTable(data.tableId);
            }
        }
    });
},
于 2013-04-25T16:20:53.907 回答
1

这里的问题是在 'success' 方法中，'this' 关键字是指包含 'success' 方法的 ajax 对象。

解决此问题的简单解决方法是：

var homePageKeycontroller = {

  var that = this;

  createNewTable : function(){
    $.ajax({
        url: "http://mywebiste.com/createAjaxTable",
        type:'post',
        dataType:'json',
        context:this,
        success:function(data){
            if(data.status == JsonStatus.OK){
                alert("Table ID: "+data.tableId);
                that.joinTable(data.tableId);
            }
        }
    });
},

joinTable : function(_tId){
    $.ajax({
        url:"http://mywebsite.com/JoinTable",
        type:'post',
        dataType:'json',
        data:{tableId:_tId},
        context:this,
        success:function(data){
            if(data.status == JsonStatus.OK){
                that.showTable();
            }
        }
    });
},
showTable : function(){
    $.ajax({
        url : 'http://mywebsite.com/showTable',
        success:function(data){
            DOM.mainCanvas.html(data);
        }
    });
}

}

于 2013-04-25T16:21:32.993 回答
0

也许尝试 .done() 语法而不是 :success。我在使用成功方法时遇到过这类问题，但在使用 done() 方法时从未遇到过。

createNewTable : function(){
        $.ajax({
            url: "http://mywebiste.com/createAjaxTable",
            type:'post',
            dataType:'json',
            context:this
        }).done(function(data){
            if(data.status == JsonStatus.OK) {
                alert("Table ID: "+data.tableId);
                this.joinTable(data.tableId); // issue here
            }
        });
    },
于 2013-04-25T16:37:45.527 回答