Question

我有一个2下拉列表，我希望第二个下拉列表的值会根据用户为第一个下拉列表选择的内容而改变。

$( "#route" ).change(function(){
routeSelect = $(this).val();

$("#clear").remove();

switch(routeSelect){
    case 'Q':
        console.log(routeSelect);
        for(var i=0;i<routeQ.stopTitle.length;i++){
            $("#stopTitle").append("<option id=\"clear \" value="+ routeQ.stopTitle[i].name + ">"+ routeQ.stopTitle[i].name + "</option>");
        }
        break;
    case 'T':
        //$("#clear").remove();
        console.log(routeSelect);
        for(var i=0;i<routeT.stopTitle.length;i++){
            $("#stopTitle").append("<option id=\"clear \" value="+ routeT.stopTitle[i].name + ">"+ routeT.stopTitle[i].name + "</option>");
        }
        break;
    default:
        console.log(routeSelect);
        break;
}
});

当我第一次选择第一个下拉列表时，此代码有效，但在调用remove（）之后，它不会再追加。

例如，我在第一个下拉列表中选择Q，我的第二个空下拉列表正确附加，但是当我选择T时，第二个下拉列表不会改变。

Answer 1

原来逃脱角色无效，我需要添加＆＃34;清除＆＃34;手动

$("#stopTitle").append('<option id="' + "clear"+ '" value="'+ routeQ.stopTitle[i].name + '">'+ routeQ.stopTitle[i].name + '</option>');

VS

$("#stopTitle").append("<option id=\"clear \" value="+ routeQ.stopTitle[i].name + ">"+ routeQ.stopTitle[i].name + "</option>");

调用remove（）后如何重新追加元素？

1 个答案: