动态生成的选择标记选项未被jquery过滤

时间:2014-11-12 11:47:36

标签: java javascript jquery jstl

我使用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);
});

如何预选价值? 任何帮助都会得到极大的赞赏!!!

1 个答案:

答案 0 :(得分:1)

改为:

$(".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);
});

Sample Demo

Updated Sample Demo


-> : jquery未进入警报状态。

因为您对选项元素上的选项进行了.each()次迭代。


虽然你也可以改为:

$(".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);
});

Sample for this.