.toggle() 不适用于 IE9

Question

我想在点击 link 时显示一些信息，您可以在此处找到：http://jsfiddle.net/t4f8yer0/1/

html:

<a href="#" class="more">show more</a> <br>
<div class="toggle">
this is more
</div>

js:

$(document).ready(function(){
  $(".toggle").css('display','none');

  $( ".more" ).click(function() {
    $(event.target).next().next().toggle( "slow" );
  });
});

这适用于 chrome 和 IE edge，但不适用于 IE9 或 IE10。这个问题有解决办法吗？

Answer 1

而不是：

$(event.target);

使用：

$(this);

jsFiddle example

不同版本的 IE 存在 jQuery 正常化的问题，例如您在 event.target 中看到的问题。

Answer 2

我更改了您的代码以引用 toggle div class，它似乎可以正常工作。

$(document).ready(function(){
    $(".toggle").css('display','none');

    $( ".more" ).click(function() {
        $(".toggle").toggle("slow");
    });
});

Answer 3

为此HTML：

<a href="#" class="more" data-target="#more1">show more</a> <br>
<div id="more1" class="toggle" style="display:none;">
    this is more
</div>

这个 JS:

$(document).ready(function(){
    $( ".more" ).click(function() {
        var tgt = $(this).attr('data-target');
        $(tgt).toggle( "slow" );
    });
});

这允许您设置切换目标。 See it work here

.toggle() 不适用于 IE9

.toggle() does not work with IE9

jquery

internet-explorer-9

toggle