Question

在上一个问题Javascript variables not adding, only concatenating as strings中有这样的问题，没有正确添加的东西，但是直接的javascript运行正常。我现在已经在JSFiddle中构建了所有代码：http://jsfiddle.net/trout0525/L2hhof79/7/

最后，calcScores例程重复，就像我目前在我正在处理的网页上的版本一样。以下是我认为是罪魁祸首的JavaScript，主要是我使用的绑定，但我不确定原因：

JavaScript的：

    var selectionName= [
        "100pointsCol1","200pointsCol1","300pointsCol1","400pointsCol1","500pointsCol1",
        "200pointsCol1","200pointsCol2","300pointsCol2","400pointsCol2","500pointsCol2"
    ];

var teamSelection = {};
teamSelection['1'] = {};
teamSelection['2'] = {};
teamSelection['3'] = {};
teamSelection['4'] = {};
teamSelection['5'] = {};

teamSelection['1']['Selected'] = false;
teamSelection['2']['Selected'] = true;
teamSelection['3']['Selected'] = false;
teamSelection['4']['Selected'] = false;
teamSelection['5']['Selected'] = false;

teamSelection['1']['Score'] = 0;
teamSelection['2']['Score'] = 0;
teamSelection['3']['Score'] = 0;
teamSelection['4']['Score'] = 0;
teamSelection['5']['Score'] = 0;



window.onload = function() {
    $(function(){
        for (var i=0; i < selectionName.length; i++) {
            selection = selectionName[i];
            $("#" + selection).bind("click", {sName: selection}, makeSelection);
        }
    });
}

function makeSelection(event) {
    selection = event.data.sName;

    $("#" + selection).unbind("click");
    openQuestion(selection);
}



function startGame() {
    showGameboard();
}

function showGameboard() {
    $("#scoreboard").css("z-index", 100);
    $("#gameboard").css("z-index", 100);
    $("#startboard").css("z-index", 1);
}

function openQuestion(selection) {
    $("#scoreboard").css("z-index", 1);
    $("#gameBoard").css("z-index",1);
    $("#questionWindow").css("z-index",100);

    amount = selection.substr(0, selection.length-10); 

   $("#questionWindow").bind("click", function(){
        openAnswer(amount);
    });
}

function openAnswer(amount){

    $("#questionWindow").unbind("click");

    $("#questionWindow").css("z-index",1);
    $("#answerWindow").css("z-index",100);

    $("#answerWindow").bind("click", function(){
        calcScores(amount)
        showGameboard();
    });
}

function calcScores(amount) {
    $("#answerWindow").css("z-index",1);

    amount = parseInt(amount,10);

    for(var key in teamSelection) {

        var total = 0;

        if (teamSelection[key]['Selected']) {
            score = parseInt(teamSelection[key]['Score'],10);
            alert("score: " + score + "\n" +
                  "amount: " + amount + "\n" +
                  "total: " + total);
            var total = +score + +amount;
            alert("score: " + score + "\n" +
                  "amount: " + amount + "\n" +
                  "total: " + total);
            teamSelection[key]['Score'] = total;
        }
    }
    return;
}

那么，为什么要重复计算？

Answer 1

查看我更新的jsFiddle：http://jsfiddle.net/L2hhof79/22/

问题

发生这种情况是因为您多次绑定了答案窗口的点击事件处理程序。该事件处理程序然后调用calcScores（）。

见下文：

function openAnswer(amount){
    $("#questionWindow").unbind("click");

    $("#questionWindow").css("z-index",1);
    $("#answerWindow").css("z-index",100);

    $("#answerWindow").bind("click", function(){
        calcScores(amount)
        showGameboard();
    });
}

因此，每次openAnswer（）函数运行时，另一个事件处理程序都必须回答Windows的点击事件。换句话说，每次进行选择时，calcScores（）都会被称为额外的时间。

潜在修复

最快的解决方法是将bind（）函数调用更改为one（）函数调用：

$("#questionWindow").one("click", function() { //...

和

$("#answerWindow").one("click", function() { //...

这只允许事件处理程序绑定一个调用。

另一个错误

selectionName 变量的声明中也有拼写错误。错字导致将两个事件处理程序绑定到 200pointsCol1 选择。你应该明白为什么。我在我的jsFiddle中解决了这个问题。

Answer 2

因为您正在使用两个onload回调..

删除此

window.onload = function（）{ }

做简单添加时Javascript重复

2 个答案:

问题

潜在修复

另一个错误