字体图标方向转化不了？

Question

<a class="glyphicon glyphicon-chevron-down" id="row"></a>

$("#row").click(function(){
    $(this).toggleClass('glyphicon glyphicon-chevron-up');
})

为什么转换不了箭头方向？

Answer 1

toggleClass的用法就是，如果你选择的页面元素中存在class属性，那就去掉calss属性；如果不存在class属性，就添加class属性。

<a class="glyphicon glyphicon-chevron-down" id="row"></a>

$("#row").click(function(){
    $(this).toggleClass('glyphicon glyphicon-chevron-up');
}) 

点击一次的时候，代码去掉 ‘glyphicon’ 加上 ‘glyphicon-chevron-up’
代码变成了

<a class="glyphicon-chevron-down glyphicon-chevron-up" id="row"></a>

所以图标显示不出来

要想实现切换可以改成

$("#row").click(function(){
    $(this).toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
})