Question

我正在制作游戏，您可以点击here。我的第一个问题是为什么我要

无法读取属性＆＃39; text＆＃39;未定义的

当蛇（绿色块）撞到食物（红色圆圈）时。

调用错误的行是来自

的this.scoreElem.text(newScore);

function StatHandler ( totalScoreSelector, fruitEatenSelector )
{
    this.scoreElem = $(totalScoreSelector);
    this.fruitEeatenElem = $(fruitEatenSelector);

    this.incrementScore = function ( incAmount )
    {
        $.ajax({
            type: "POST",
            url: "Play/IncrementScore?amount=" + incAmount,
            success: function (newScore)
            {
                this.scoreElem.text(newScore);
            },
            error: function ( ) 
            {
                alert("error occured!");
            }
        });
    }
}

StatHandler对象的实例由

创建

var H = new StatHandler("#total-score", "#fruit-eaten");

在$(document).ready内，我已经确认#total-score和#fruit-eaten是有效的选择器，因为它们是id个已经验证过的元素在DOM中。

可以看到完整的代码here。

另外，正如您可能已经注意到的那样，我尝试更新服务器端的分数并将更新的分数发送回客户端。但是，这并不能阻止客户通过运行

作弊

SG.stats.incrementScore(1000000000);

在JS控制台中

。我该如何防止作弊？

Answer 1

目前，您的this关键字并未引用您想要的对象。它受成功函数范围的约束。所以this.scoreElem未定义。在undefined上调用text会引发错误。

function StatHandler ( totalScoreSelector, fruitEatenSelector )
{
    this.scoreElem = $(totalScoreSelector);
    this.fruitEeatenElem = $(fruitEatenSelector);

    this.incrementScore = function ( incAmount )
    {
        var self = this;
        $.ajax({
            type: "POST",
            url: "Play/IncrementScore?amount=" + incAmount,
            success: function (newScore)
            {
                self.scoreElem.text(newScore);
            },
            error: function ( ) 
            {
                alert("error occured!");
            }
        });
    }
}

通过this提及self将使其发挥作用。由于JavaScript使用词法作用域，因此在解析ajax成功函数时，变量self将可用。

Answer 2

如果您不希望它成为设置对象，则可以使用context选项的$.ajax属性来设置回调中的this。

this.incrementScore = function ( incAmount )
    {

        $.ajax({
            type: "POST",
            context: this, // set callback context
            url: "Play/IncrementScore?amount=" + incAmount,
            success: function (newScore)
            {
                this.scoreElem.text(newScore);
            },
            error: function ( ) 
            {
                alert("error occured!");
            }
        });
    }

为什么我得到＆＃34;无法阅读财产＆＃39; text＆＃39;未定义＆＃34;在这个例子中？

2 个答案: