Question

所以我在Lightbox中的表单上有一个动态选项，所以当你选择英国或美国时，你会给你两个（或应该）给你一个英国郡或美国各州的名单。问题是我的选择似乎已经合并了？

所以我需要将两个列表分开，所以当你点击我们时你只能获得状态，当点击英国时你会得到英国的县？

$(document).on("change", "select.common", function() { 
    $("select.common").not(this).val( this.value ) //added .not(this) since we dont need to change the value of the select being interacted with
});

Answer 1

如果我理解正确，您希望过滤城市选项以显示＆＃39; UK＆＃39;或者＆＃39;美国＆＃39;基于所选国家/地区。这是我刚刚创建的一个示例，用于显示基本过滤器：

// Set default values
var ukCities = ['Avon', 'Bedfordshire', 'Berkshire'];
var usCities = ['Alabama', 'Alaska', 'Arizona'];

$(document).on("change", "select.country", function() {
    // Get the current country value
    var country = $("select.country").val();
    var cities;
    if(country === 'UK'){
        cities = ukCities;
    }
    else{
        cities = usCities;
    }
    // Clear options
    $("select.city").empty();
    // Add new options
    $.each(cities, function(index, element){
            $("select.city").append($("<option></option>").attr("value", country).text(element));
    });
});
// Default data is set as UK
$("select.country").val('UK').trigger('change');

见JSFiddle。

Answer 2

有几种方法可以做到这一点。下面是通过使用jQuery隐藏/显示适合的选项来实现的。仅供参考 - 我将每个州的价值更改为一个类，因为您可能需要该值以便在以后提交表单时返回实际状态。

$(document).ready(function () {
    $('.country').on('change', function () {
        var country = $(this).val();
        $('.common option').each(function () {
            if ($(this).hasClass(country)) {
                $(this).show();
            } else {
                $(this).hide();
            }
        });
    });
});

Answer 3

您需要删除之前的内容，例如：

$('#element').value('');

然后做你的事......

动态选择不分离选项

3 个答案: