如何在jQuery中只附加数组的一部分

时间:2017-02-17 09:16:26

标签: javascript jquery arrays append

我在包数组中有12个元素,根据剂量,我需要将一定数量的包附加到input select。我怎么能这样做?

我尝试使用for循环,但我只看到空的生成选项。 任何帮助都是适用的。

这是数组

var packages = [{
        val: '',
        text: 'Package amount
    }, {
        val: 1,
        text: '1 packs'
    }, {
        val: 2,
        text: '2 packs'
    }, {
        val: 3,
        text: '3 packs'
    },  {
        val: 4,
        text: '4 packs'
    }, {
        val: 5,
        text: '5 packs'
    }, {
        val: 6,
        text: '6 packs'
    }, {
        val: 7,
        text: '7 packs'
    }, {
        val: 8,
        text: '8 packs'
    }, {
        val: 9,
        text: '9 packs'
    }, {
        val: 10,
        text: '10 packs'
    }, {
        val: 11,
        text: '11 packs'
    }, {
        val: 12,
        text: '12 packs'
    }];

这是剂量

if (dosage === "50mg") {
//1-3 packs here
} else if (dosage === "100mg") {
//2-6 packs here
} else if (dosage === "150mg") {
//3-9 packs here
} else if (dosage === "200mg") {
//4-12 packs here
}

2 个答案:

答案 0 :(得分:2)

您应该使用.append()方法来创建select选项。

此外,您应该使用.slice()方法将数组中的选定元素作为新数组对象返回。

对于一个干净的解决方案,我提供了一个名为getOptions的函数,它创建select,其选项取决于dosage值。

function getOptions(from,to){
     packages.slice(from,to+1).forEach(function(item){
        $('select').append($("<option></option>")
                .attr("value",item.val)
                .text(item.text));
     });
}

另外,我建议您使用switch声明。

这是完整的工作解决方案

&#13;
&#13;
var packages = [
    {
        val: '',
        text: 'Package amount'
    }, {
        val: 1,
        text: '1 packs'
    }, {
        val: 2,
        text: '2 packs'
    }, {
        val: 3,
        text: '3 packs'
    }, {
        val: 4,
        text: '4 packs'
    }, {
        val: 5,
        text: '5 packs'
    }, {
        val: 6,
        text: '6 packs'
    }, {
        val: 7,
        text: '7 packs'
    }, {
        val: 8,
        text: '8 packs'
    }, {
        val: 9,
        text: '9 packs'
    }, {
        val: 10,
        text: '10 packs'
    }, {
        val: 11,
        text: '11 packs'
    }, {
        val: 12,
        text: '12 packs'
    }];
var dosage="100mg";
switch(dosage){
   case "50mg":
      getOptions(1,3);
      break;
   case "100mg":
      getOptions(2,6);
      break;
   case "150mg":
      getOptions(3,9);
      break;
   case "200mg":
      getOptions(4,12);
      break;
}
function getOptions(from,to){
    packages.slice(from,to+1).forEach(function(item){
            $('select').append($("<option></option>")
                    .attr("value",item.val)
                    .text(item.text));
      });
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
</select>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

试试这个:

$(document).ready(function () {
    var packages = [{
        val: '',
        text: 'Package amount'
    }, {
        val: 1,
        text: '1 packs'
    }, {
        val: 2,
        text: '2 packs'
    }, {
        val: 3,
        text: '3 packs'
    },  {
        val: 4,
        text: '4 packs'
    }, {
        val: 5,
        text: '5 packs'
    }, {
        val: 6,
        text: '6 packs'
    }, {
        val: 7,
        text: '7 packs'
    }, {
        val: 8,
        text: '8 packs'
    }, {
        val: 9,
        text: '9 packs'
    }, {
        val: 10,
        text: '10 packs'
    }, {
        val: 11,
        text: '11 packs'
    }, {
        val: 12,
        text: '12 packs'
    }];
    // adding a dosage variable static. You can use your own dosage variable.
    var dosage = "50mg";
    if (dosage === "50mg") {
        //1-3 packs here
        for (var i = 0; i <= 3; i++) {
            $('#packageddl').append($('<option>', { value: packages[i].val, text: packages[i].text }));
        }

    } else if (dosage === "100mg") {
        //2-6 packs here
        for (var i = 2; i <= 6; i++) {
            $('#packageddl').append($('<option>', { value: packages[i].val, text: packages[i].text }));
        }
    } else if (dosage === "150mg") {
        //3-9 packs here
        for (var i = 3; i <= 9; i++) {
            $('#packageddl').append($('<option>', { value: packages[i].val, text: packages[i].text }));
        }
    } else if (dosage === "200mg") {
        //4-12 packs here
        for (var i = 4; i <= 12; i++) {
            $('#packageddl').append($('<option>', { value: packages[i].val, text: packages[i].text }));
        }
    }
});

和你的jquery代码如下:添加你的剂量变量,因为我在其中放置一个静态值进行测试。

udev