Jquery show() 函数在 IE8 中不起作用

Question

我有以下代码在 Chrome 和 Firefox 中运行良好，但在 IE8 或我假设低于 8 的版本中运行不佳。

<script type="text/javascript">
$(function() {
      $('div.hidden').hide();
      $('input.show:checked').each(function() {
            $('#' + $(this).val()).show();
      });
      $('input.show').click(function() {
            $('div.hidden').hide();
            $('#' + $(this).val()).show();
      });
});
</script>

一开始我以为可能是:checked选择器的问题，所以我把我的代码改成如下:

<script type="text/javascript">
$(function() {
      $('div.hidden').hide();
      $('input.checked').each(function() {
            $('#' + $(this).val()).show();
      });
      $('input.show').click(function() {
            $('div.hidden').hide();
            $('#' + $(this).val()).show();
      });
      $("input[type='checkbox']").click(function() {
            $(this).parent().toggleClass("checked", this.checked);
      });
});
</script>

运气不好，所以我尝试使用 IE9.js 和 IE8.js，但都没有效果。在那之后，我又回到了选择器上，并尝试交换这个:

$('input.checked').each(function() {

有了这个:

$('input[checked="checked"]').each(function() {

同样，我空手而归，所以现在我开始认为它可能不是选择器。我在这里搜索过，当然还有谷歌搜索，但没有找到任何结果。谁能告诉我为什么我的代码不能在 IE8 中运行？这也是一个 JSFiddle:http://jsfiddle.net/DrydenLong/bP4Uf/

谢谢!

Answer 1

您的复选框有 display: none。这似乎就是它在 IE8 中不起作用的原因。

一个可能的解决方法是将您的点击事件直接绑定(bind)到标签，例如:

$('.show_label').click(function() {
    var $input = $(this).find('input');
    $('div.hidden').hide();
    $('#' + $input.val()).show();
});

http://jsfiddle.net/thirtydot/bP4Uf/5/