Question

我正在制作一个简单的下拉列表，根据所选内容更改内容。但是，除了删除以前的内容外，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" });

    }

})

}）

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

Answer 1

这一行：

$("#analyzecontainer :last-child")

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

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

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

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

每次更改我的下拉选项时，它都会删除最后一个下拉选项

1 个答案: