循环遍历一组对象?

时间:2016-05-11 14:13:34

标签: javascript arrays loops object

我正在尝试创建一个印花税计算器。

目前,我有一个包含3个属性的对象数组,每个对象具有相同的属性名称但值不同。

如果单击一个按钮,我试图遍历此数组以将属性1和2附加到表行,但是循环仅附加第一个对象属性而不是其他对象属性。

我知道有类似的查询,但没有一个有帮助。我确信我有一些简单的东西。

我还附上了一个img,以便更好地理解这个问题

enter image description here

这是我的代码

         var taxbands = [
         {
             min: 0,
             max: 125000,
             percent: 0
         },
         {
             min: 125000,
             max: 250000,
             percent: 0.02
         },
         {
             min: 250000,
             max: 925000,
             percent: 0.05
         },
         {
             min: 925000,
             max: 1500000,
             percent: 0.1
         },
         {
             min: 1500000,
             max: null,
             percent: 0.12
         }
     ]

     var tableRow = "<tr><td>{taxband}</td><td>{percent}</td><td>{taxable}</td><td>{TAX}</td></tr>";

     $('#calculate').on('click', function calculateButton() {
        calculateStampDuty();
     })

     function calculateStampDuty() {

        var userInput = parseInt($("#input-value").val());

        for (i = 0; i < taxbands.length; i++) {
            if (userInput < 125000) {
                tableRow = tableRow.replace("{taxband}", taxbands[i].min + "-" + taxbands[i].max);
                $("#explained-table").append(tableRow);
            }
        }

     }

1 个答案:

答案 0 :(得分:5)

这是因为您分配了替换值&#34; tableRow&#34;回到&#34; tableRow&#34;。在第一次迭代之后,tableRow不包含&#34; {taxband}&#34;再也没有效果了。

tableRow = tableRow.replace("{taxband}", taxbands[i].min + "-" + taxbands[i].max);
                $("#explained-table").append(tableRow);

您应该添加一个中间变量:

var myRow = tableRow.replace("{taxband}", taxbands[i].min + "-" + taxbands[i].max);
                $("#explained-table").append(myRow );