下拉列表选择在Internet Explorer中无法正常工作

Question

我有各种下拉列表，在某种程度上如果我们选择第一项不应该显示在第二个下拉列表中我已经写了jquery像

$(document).ready(function() {
    $('.ddlProjectvalue').change(function() {
        updateDDLValues();       
    });
});

function updateDDLValues() {
    // Display all
    $('.ddlProjectvalue option').show();
    // Hide all selected options from other selectlists
    $('.ddlProjectvalue').each(function(i,element) {
        var selectedvalue = $(element).find('option:selected').val();
        $('.ddlProjectvalue').not(element).find('option[value="'+selectedvalue+'"]').hide();
    });    
}

你可以检查jsfiddle.net ，它在chrome和firefox中工作正常，但不能在Internet Explorer中工作，有什么问题？

Answer 1

似乎大多数浏览器都不允许隐藏<option>。 我认为要走的路是完全删除<option>。

Answer 2

我发现了问题， $(element).find('option:selected').val()此元素中的$(element).find('option:selected').val()在IE中未定义，而在chrome中，正确的值即将到来

Answer 3

仅适用于Internet Explorer，此功能对我来说很好

function updateDDLValues() {
// Display all
$('.ddlProjectvalue span option').unwrap();
   // Hide all selected options from other selectlists
    $('.ddlProjectvalue').each(function (i, element) {
    var selectedvalue = $(element).find('option:selected').val();
    $('.ddlProjectvalue').not(element).find('option[value="' + selectedvalue + '"]').wrap('<span style="display: none;">');
});
}

要么

function updateDDLValues() {
$('.ddlProjectvalue span option').unwrap().show();
 // Hide all selected options from other selectlists
  $('.ddlProjectvalue').each(function (i, element) {
   var selectedvalue = $(element).find('option:selected').val();
   $('.ddlProjectvalue').not(element).find('option[value="' + selectedvalue + '"]').wrap('<span>').hide();
                });
}

如果我们想使用除IE之外的其他代码，我们可以使用IE不支持的上述代码（在我的问题中）。