jquery未筛选的动态生成的select标记选项

Dynamically generated select tag option not filtered by jquery

本文关键字:select 选项 筛选 动态 jquery      更新时间:2023-09-26

我使用jstl动态生成select标记,如下所示。但是我没有选择jquery中的选项。

JSP:

<c:forEach var="p" items="${model.multiphase}" varStatus="row">
    <select class="form-control status" name="status">
        <option value="Notyetstarted">Not Yet Started</option>
        <option value="Inprogress">InProgress</option>
        <option value="Onhold">OnHold</option>
        <option value="Closed">Closed</option>
    </select>
    <input type="hidden" id="upstatus_${row.index}" value="<c:out value='${p.getProjectPhase().getPhaseStatus()}'/>" />
</c:forEach>

上面的jstl生成下面的html

<select class="form-control status" name="status">
        <option value="Notyetstarted">Not Yet Started</option>
        <option value="Inprogress">InProgress</option>
        <option value="Onhold">OnHold</option>
        <option value="Closed">Closed</option>
    </select>
    <input type="hidden" id="upstatus_0" value="Closed" />
 <select class="form-control status" name="status">
        <option value="Notyetstarted">Not Yet Started</option>
        <option value="Inprogress">InProgress</option>
        <option value="Onhold">OnHold</option>
        <option value="Closed">Closed</option>
    </select>
    <input type="hidden" id="upstatus_1" value="Onhold" />

我使用了下面的jquery来选择选项。

$(".status option").each(function () {
    alert("fd");
    $(this).find("option").filter(function () {
        return $(this).val() == $("#upstatus_" + index).val();
    }).prop('selected', true);
});

如何预选数值?任何帮助都将不胜感激!!!

更改为:

$(".status").each(function () {
    var that = $(this);
    $(this).find('option').filter(function (index) {
        console.log($(this).parent().next(":hidden").val());
        return $(this).val() === that.next(":hidden").val()
    }).prop('selected', true);
});

示例演示

更新的示例演示


-> :jquery未进入警报

因为在选项上有.each()迭代,而在select元素上没有。


尽管您也可以更改为:

$(".status").each(function (i) { // add a index "i" here
    $(this).find('option').filter(function () {
        return $(this).val() === $("#upstatus_"+i).val() // use that here
    }).prop('selected', true);
});

此示例