jquery - jQuery 丢失选择值

Question

我正在准备链接下拉列表，其中选择第二个下拉列表的第一个更改值。以下是我的代码。它改变了价值。

$('#subSelect option[data-option="option0"]').show();
$('#mainSelect').live('change', function () {

    $('#subSelect option').hide();
    $('#subSelect option[data-option="' + $(this).val() + '"]').show();
    var $myva = $('#mainSelect').attr('title');
    alert($myva);
    $('#subSelect option:visible:first').attr('selected', true);
});
$('#mainSelect').trigger('change');

我丢失了下拉列表的实际值，它给出了 option0、option1 - option13。请指导。

Answer 1

尝试

var $sub = $('#subSelect');
var subOpts = $sub.html();

$('#subSelect option:not([data-option="option0"])').remove();
$('#mainSelect').on('change', function () {
    var select = $(this).val();

    $sub.empty();
    var opts = $(subOpts).filter('[data-option="' + select + '"], [data-option="option0"]').appendTo($sub)

    $sub.val(opts.first().val())
}).trigger('change');

演示：小提琴