Question

在你-1之前因为这个简单的问题进一步阅读，因为我花了一段时间搜索并且无法弄明白。我所拥有的是5个选择框。每个结果取决于之前选择的内容。没有提交按钮。我只需要根据前一个框中选择的内容进行更改，到目前为止我已经有了。哦，结果是从数据库中提取的。问题是，当您在框中选择一个选项时，框2显示选项框，但当您再次选择框1中的选项时，它们的选项只会叠加在其他选项上。当它再次改变时我需要它们清除。我会发布我拥有的js，如果你需要其他任何东西，请问。

P.S。我正在使用php-mysql获取选项。 p.s.s这个网站必须在明天完成，所以我有点匆忙。请不要浪费时间告诉我这是一个愚蠢的问题或什么不是。

提前感谢您的帮助。

$(function () { //When the page is finished loading run this code
    $('#country').change(function () {
        $.ajax({
            url: "<!--Base url taken out-->/discovery/aLoad",
            success: function (data) {
                eval(data);
            },
            error: function () {
                alert('failed');
            },
            data: {
                country: getSelectValues('#country')
            },
            type: 'POST'
        });
    });
 });

     function changeSearchBar (newBar) {
    //remove the crap
    function ClearOptions(country)
    {
    document.getElementById('country').options.length = 0;
    }

    for (var i = 0; i <= newBar.length; i++) {
        newBar[i].id = newBar[i][0];
        newBar[i].name = newBar[i][1];
        $('#group').append(
            $('<option></option>').attr('value', newBar[i].id).text(newBar[i].name)
        );
    }
     }

     function getSelectValues (sId) {
    var str = "";

    $(sId +" option:selected").each(function () {
        str += $(this).val() + ",";
    });

    return str.replace(/.$/g, '');
}

Answer 1

根据我从您的长篇文章中理解的内容，您只需要在开始从AJAX请求中添加新选项之前删除所有select子项。

在for循环之前尝试这样的事情：

$('#group').html('');

演示： http://jsfiddle.net/57TYu/2/

Answer 2

在这里，我认为这基本上就是你要做的事情：

How do you remove all the options of a select box and then add one option and select it with jQuery?

基本上，在select中找到'option'标签并将其删除。

$('select').find('option').remove()

将清除所有选择框。

这将附加数据，假定这些数据代替它们：

$('select').find('option').remove().end().append(data);

我认为这就是你要找的东西。

使用javascript更改选择选项

2 个答案: