Question

我正在尝试添加（并删除但我将尝试使用此功能）当所述选择更改时，基于主选择的值进行多项选择。

我有一个

Number of Selects
    <select id="selectNumber">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    </select>

还有一个

Select 1 Options
    <select id="selectN1">
    <option>option1</option>
    <option>option2</option>
    </select>

现在，更改#selectNumber应该根据他的值添加更多的SelectN *，这应该是这样做的：

$("#selectNumber").on("change", function(){
    var n = $("#selectNumber").val();
    for (i=2;i<=n;i++){
        var c = i-1;
        $("#selectN"+c).after("<br />Select "+i+" options <select id='selectN"+i+"'><option>option1</option><option>option2</option></select>");
    }
}
);

这是小提琴 http://jsfiddle.net/xPZUn/14/

在我的页面上它运行正常，但它只添加了第二个选择项（即使在主选择中选择了3个以上）我猜这是因为for循环无法选择动态创建的元素来追加更多。在小提琴上它甚至没有添加第二个选择。

有什么建议吗？

由于

Answer 1

首先，您的代码有几个语法错误，缺少右括号和大括号。一旦修复了它，它就会起作用，但是如果你选择3，然后1，你最终会得到4个选择元素，所以你需要清除之前的附加元素。试试这个：

$("#selectNumber").on("change", function () {
    $('.additional-select').remove(); // remove existing
    for (i = 1; i < +$("#selectNumber").val(); i++) {
        $("#selectN" + i).after('<div class="additional-select">Select ' + (i + 1) + ' options <select id="selectN' + (i + 1) + '"><option>option1</option><option>option2</option></select>');
    }
});

Example fiddle

请注意，i + 1包含在括号中，以确保附加结果，而不是之前发生的i和1的值。

Jquery基于值添加元素

1 个答案: