Question

javascript新手！这有效，但我还有很多工作要做，如果有更简洁的方法可以做到这一点会很棒。如果需要，请打开使用jquery：）

（堆栈希望我在提交之前写更多内容，但我不确定还有什么要说的）

<script>

function apply(){
    var backerPrediction1 = document.getElementById("backer-prediction-1").value;
    var backerPrediction2 = document.getElementById("backer-prediction-2").value;
    var backerPrediction3 = document.getElementById("backer-prediction-3").value;
    var backerPrediction4 = document.getElementById("backer-prediction-4").value;
    var backerPrediction5 = document.getElementById("backer-prediction-5").value;
    var backerPrediction6 = document.getElementById("backer-prediction-6").value;
    var backerPrediction7 = document.getElementById("backer-prediction-7").value;
    var backerPrediction8 = document.getElementById("backer-prediction-8").value;
    var backerPrediction9 = document.getElementById("backer-prediction-9").value;
    var backerPrediction10 = document.getElementById("backer-prediction-10").value;
    var backerPrediction11 = document.getElementById("backer-prediction-11").value;
    var backerPrediction12= document.getElementById("backer-prediction-12").value;
    var backerPrediction13 = document.getElementById("backer-prediction-13").value;
    var backerPrediction14 = document.getElementById("backer-prediction-14").value;
    var backerPrediction15 = document.getElementById("backer-prediction-15").value;
    var backerPrediction16 = document.getElementById("backer-prediction-16").value;
    var backerPrediction17 = document.getElementById("backer-prediction-17").value;
    var backerPrediction18 = document.getElementById("backer-prediction-18").value;
    var backerPrediction19 = document.getElementById("backer-prediction-19").value;
    var backers = parseInt(backerPrediction1,10) +
              parseInt(backerPrediction2,10) +
              parseInt(backerPrediction3,10) +
              parseInt(backerPrediction4,10) +
              parseInt(backerPrediction5,10) +
              parseInt(backerPrediction6,10) +
              parseInt(backerPrediction7,10) +
              parseInt(backerPrediction8,10) +
              parseInt(backerPrediction9,10) +
              parseInt(backerPrediction10,10) +
              parseInt(backerPrediction11,10) +
              parseInt(backerPrediction12,10) +
              parseInt(backerPrediction13,10) +
              parseInt(backerPrediction14,10) +
              parseInt(backerPrediction15,10) +
              parseInt(backerPrediction16,10) +
              parseInt(backerPrediction17,10) +
              parseInt(backerPrediction18,10) +
              parseInt(backerPrediction19,10)
;
document.getElementById("backer-prediction-answer").value = (backers);
}
</script>

感谢您的帮助！：）

Answer 1

我会这样做：

function apply() {
    var backers = 0;
    for (var i = 1; i < 20; ++i) {
        backers +=
            parseInt(document.getElementById("backer-prediction-" + i).value);
    }
    document.getElementById("backer-prediction-answer").value = backers;
}

Answer 2

最简单的方法是给每个backer-prediction-#元素一个类并抓住所有元素：

var backerEls = document.querySelectorAll('.backer-prediction');
//Get a list of all the elements with the class 'backer-prediction'
var backers = 0;
//Total
for (var i = 0; i < backerEls.length; i++) {
    //Loop over the elements
    backers += parseInt(backerEls[i].value, 10);
    //Parse their values and add them to the total
}

console.log(backers);

（Demo）

这使您可以拥有任意数量的元素而无需更新JS。

Answer 3

var answer = 0;
for(var i = 1; i <= 20; i++) {
 answer += parseInt(document.getElementById("backer-prediction-" + i).value), 10);
}

document.getElementById("backer-prediction-answer").value = answer;

Answer 4

您可以使用以下代码获取支持者总数。

function apply(){
    var answer = getBackers();
    document.getElementById("backer-prediction-answer").value = answer;
}

function getBackers()
{
    var baseName = "backer-prediction-";
    var elementId = "";
    var backers = 0;
    for(var i = 1; i < 20; i++)
    {
        elementId = baseName + i;
        backers = backers + getElementValue(elementId);
    }

    return backers;
}

function getElementValue(elementId)
{
    var value = document.getElementById("backer-prediction-1").value;
    return parseInt(value, 10);
}

有什么办法简化这段代码吗？

4 个答案: