1

我正在制作一个简单的下拉菜单，根据所选内容更改内容。然而，随着擦除以前的内容，jquery 也删除了最后一个下拉选项。

这是我的 HTML。

<body>
<h2>Analyze</h2>
<form id="analyze" method="get" action="/results/">
<div id="analyzecontainer">
<p>Search by: </p>
<select id="analyzeselector" class="dropdown" name="analyzeselector">
<option class="dropdownitem" name="select">Select</option>
<option id="byexercisename" class="dropdownitem" name="byexercisename">By Exercise Name </option>
<option id="bydate" class="dropdownitem" name="bydate" value="date">By Date</option>
<option id="byworkoutname" class="dropdownitem" name="byworkoutname" value="workoutname">By Workout Name</option>
</select>
<input id="exercisename" class="textbox required" type="text" name="exercisename" value="Enter Exercise Name">
</div>
<input class="textbox int" type="text" value="How many results" name="numresults">
<input id="submitquery" type="submit">
</form>
</body>

现在这是我的 Jquery 代码：

$(document).ready(
function () {


$(document).on("change", "#analyzeselector", function () {
    var selected = $(this).find(':selected').attr("name");
    if ($("#analyzecontainer :last-child").attr('id') != 'analyzeselector') {
        alert($("#analyzecontainer :last-child").attr('id'))
        $("#analyzecontainer :last-child").remove()
    }

    if (selected == 'byexercisename') {

        $('<input>').attr({
            type: 'text',
            id: 'exercisename',
            name: 'exercisename',
            value: "Enter Exercise Name",
            class: "textbox required"
        }).appendTo('#analyzecontainer')

    }

    else if (selected == 'bydate') {
        $("#analyzecontainer").datepicker({ dateFormat: "yy-mm-dd" });

    }

})

})

同样，每次更改我的下拉选择时，它都会删除最后一个下拉选项。多谢你们！欣赏它。

4

1 回答 1

2

这一行：

$("#analyzecontainer :last-child")

没有做你认为它正在做的事情。它正在删除#analyzecontainer其父级的最后一个子级下面的每个元素。这包括 a 中的最后一个 option元素select。

您可以使用:last来获取容器的最后一个孩子：

var $lastChild = $("#analyzecontainer :last");
if ($lastChild.attr('id') != 'analyzeselector') {
    $lastChild.remove()
}

示例：http: //jsfiddle.net/bthzc/1

于 2012-07-17T19:49:21.313 回答