向多个选择元素添加新选项问题

时间:2012-09-28 15:00:51

标签: javascript

我有一个表单,用户可以选择他们想要留在的几个位置,他们必须指定他们在每个位置的时间,但首先,他们必须输入他们将要进入​​的一般天数例如,在每个地点,如果我想要在第一个2天的两个地点和第二个地点的3个地点,我必须先输入5天,然后选择我想要留下的位置,为每个地点指定如何很多天我想去那儿。 那么事实是,为了防止用户为某个位置输入错误的天数,我为每个位置创建了一个选择元素,因此当用户输入一般天数时,我用这些信息填充选择元素(选项来自1工作得很好,但是当用户选择一个位置并为该位置指定一天的数量时,我希望其余的选择元素用剩余的日子来填充,所以我使用这个代码来做那个

function fillUpSelects2(start, top, who) {

    var optionArray = new Array();

    // create the new options
    for (var i = 1; i <= top; i++) {
        optionArray.push(new Option(i, i));
    }

    // get all the select elements
    var selects = jQuery("select.estanciaselect");

    // loop through the selects to change their content
    for (var i = 0; i < selects.length; i++) {

        // if selects[i] is not the one who triggered the change event
        if (selects[i].getAttribute('id') != who) {

            // then I erase all its options
            selects[i].options.length = 0;

            //and here is where it is supposed to add the new options
            for (var j = 0; j < optionArray.length; j++) {
               selects[i].options[selects[i].options.length] = optionArray[j];
            }
        }
    }
}

当我运行这个时,所有选择结束为空,但最后一个选择正确填充

2 个答案:

答案 0 :(得分:1)

如果您正在使用jQuery,您可以使用它来附加它们:

for (var i = 1; i <= top; i++) {
    $(".selects").prepend($("<option>")
                              .val(i)       // Might have to use .attr("value", i) instead
                              .html(i));
}

这是一个jsFiddle演示了你可以使用的两个选项(包括上面的一个),但还有更多:

http://jsfiddle.net/tRHYk/

答案 1 :(得分:0)

以下是如何将项目添加到多项选择的方法(虽然不能直接回答您的问题)

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.js"></script>
<script type="text/javascript">
    $(document).ready(function () {

        var o = new Option("option text", "value");
        $(o).html("option text");
        $("#leftValues").append(o);

    });
</script>

<select id="leftValues" size="5" multiple></select>

请参阅Adding options to a <select> using jQuery?