Question

我的代码很简单：

<div id='temp'></div>
<div id='points'></div> 
<div onClick ="play(1, 1)" id='click'>clickclickclick</div> 


play(function (addpoints) {
    document.getElementById('temp').innerHTML = addpoints;
}());

function play (choosecolor, randescolor) {
    if (choosecolor == randescolor) {
        if (document.getElementById('points').innerHTML === '') {
            document.getElementById('points').innerHTML=100;
        }
        else {
            var points = function (allpoints) {
                var addpoints = parseInt(allpoints) + 100;
                callback(addpoints);

                document.getElementById('points').innerHTML=addpoints;
            }
        }

        points(document.getElementById('points').innerHTML);
    }
}

我不明白为什么回调会给我一些不确定的信息。控制台说没有定义回调。这很奇怪，因为它在简单的示例代码上非常有用：

loadStuff(function (data) {
    alert('Now we have the data' + data);
});

function loadStuff (callback) {
    // Go off and make an XHR or a web worker or somehow generate some data
    var data = 'something';
    callback(data);
}

我认为有些事情我不知道并且不了解回调（）。但是什么？为什么它在第二部分代码上工作，而在第一部分却无法正常工作？

Answer 1

您的代码中未定义名为callback的变量，但在您的上一个代码段中，您确实有一个变量callback作为函数参数。

您需要引用正确的参数名称：

function play(choosecolor, randescolor){
    if(choosecolor==randescolor){
        if(document.getElementById('points').innerHTML===''){
            document.getElementById('points').innerHTML=100;}
        else{
            var points = function(allpoints){
                var addpoints=parseInt(allpoints)+100;
                choosecolor(addpoints); // Refer to choosecolor, not callback
                document.getElementById('points').innerHTML=addpoints;
            }
    }

Answer 2

原始代码将按如下方式执行：

play(function (addpoints) { document.getElementById('temp').innerHTML = addpoints; }());

未命名的内联函数正在执行而没有输入变量。在这种情况下，addpoints = undefined。因此，temp div将具有文本“undefined”。由于该函数不返回任何内容，因此现在使用choosecolor = undefined, ranescolor = undefined调用play。

function play (choosecolor, randescolor) {
    if (choosecolor == randescolor) {
        if (document.getElementById('points').innerHTML === '') {
            document.getElementById('points').innerHTML=100;
        }
        else {
            var points = function (allpoints) {
                var addpoints = parseInt(allpoints) + 100;
                callback(addpoints);

                document.getElementById('points').innerHTML=addpoints;
            }
        }

        points(document.getElementById('points').innerHTML);
    }
}

使用两个参数的undefined值执行函数播放。第一个如果评估为真，则代码恢复。如果也评估为true，则为{2}，points div将具有文本“100”。接下来尝试通过变量points的名称调用函数，但由于两者都不存在，因此会出现异常。

Answer 3

- 处理undefined; addpoints == undefined？''：addpoints;

play(function (addpoints) {
    document.getElementById('temp').innerHTML = addpoints==undefined ?'':addpoints;
}());

function play (choosecolor, randescolor) {
    if (choosecolor == randescolor) {
        if (document.getElementById('points').innerHTML === '') {
            document.getElementById('points').innerHTML=100;
        }
        else {
            var points = function (allpoints) {
                var addpoints = parseInt(allpoints) + 100;
                callback(addpoints);

                document.getElementById('points').innerHTML=addpoints;
            }
        }

        points(document.getElementById('points').innerHTML);
    }
}

检查小提琴http://jsfiddle.net/anilk/y9uer4ge/

js回调给出了undefined var以及如何定义回调

3 个答案: