css - FontAwesome Icons - 无法从 IE7 中的 JavaScript 更改 css 类

Question

我的font-awesome-ie7.min.csshtml 中有 ，但是我无法在IE7JavaScript中使用/动态更改图标类，在其他浏览器中工作正常。jQuery

<div id='iconDiv'>
    <i class='icon-hand-down'></i>
</div>
<script>
    $(document).ready(function() {
        $('#iconDiv i').addClass('icon-hand-up');
    });
</script>

任何帮助！赞赏。

Answer 1

呜呼！对于这个烦人的问题，我有一个解决方案。与所有针对IE7的编码一样，这是一个完整的 hack，但是嘿，它可以工作......

<div id='iconDiv'>
    <i class='icon-hand-down'></i>
    <i class='icon-hand-up hide'></i><!-- initially hidden -->
</div>
<script>
    $(document).ready(function() {
        $('#iconDiv i.icon-hand-down').addClass('hide');
        $('#iconDiv i.icon-hand-up').removeClass('hide');
    });
</script>

将这两个图标放入您的 DOM 并有条件地显示任何相关的图标。你明白了。我在我的应用程序中使用相同的方法进行切换。

来自bootstrap的示例 CSS ：

.hide {
  display: none;
}

.show {
  display: block;
}

作为参考，就我而言，我使用的是 AngularJS：

<i data-ng-click="collapsed = !collapsed" class="icon-collapse ng-class:{'hide':collapsed}"></i>
<i data-ng-click="collapsed = !collapsed" class="icon-collapse-top ng-class:{'hide':!collapsed}"></i>