Internet Explorer中的JQuery.hide（）列表框选项问题

在一个完美的Firefox世界中，我只需要使用.toggle选项就可以了。然而，IE和Chrome无法访问选项元素。通过使用.wrap，我能够成功地在所有浏览器中隐藏

$(document).ready(function () {
$('#lstAvailRates option').wrap('<span>').hide();
$('#btnToggle').click(function () {
$('#lstAvailRates option').unwrap('<span>').show();
});
});

理想情况下，我希望btntogle能够切换显示/隐藏。但是，我在计算正确的流程时遇到了问题

MC

你可以做

$(document).ready(function() {
    $('#lstAvailRates option').wrap('<span>').hide();
    $('#btnToggle').click(function() {
        //if there are option element that are direct children of the select
        if($('#lstAvailRates > option').length){
                //wrap them and hide them
                $('#lstAvailRates option').wrap('<span>').hide();
        }else{
            //otherwise unwrap them and show them
            $('#lstAvailRates option').unwrap('<span>').show();
        }
    });
});​

---

在这里摆弄

我认为您必须从元素中删除选项元素，然后重新添加它们。元素不正常？阻塞？元素，使基本的隐藏和显示或任何动画都无法工作。我很惊讶它甚至在Firefox中也能工作。可能是