如何在Bootstrap 3.2中点击它来更改字形？ [英] How do I change a glyphicon upon clicking it in Bootstrap 3.2?

问题描述

我想有一个指向右边的箭头，允许用户展开边栏，然后将该glyphicon更改为指向左边。这样，它指向左边，以便他们了解如何隐藏侧边栏。

I want to have an arrow pointing to the right to allow the user to expand the sidebar, and then change that glyphicon to point to the left. That way, it points to the left so that they understand how to hide the sidebar. I then want it to change back to its default state.

这是我目前的状态：

        <div id="page-content-wrapper">
        <div class='hidden-lg'>
        <div class="content-header">
                <h1>
                <a id="menu-toggle" href="#" class="btn btn-default"><i class="glyphicon glyphicon-arrow-right"></i></a>
                </h1>
        </div>
        </div>

推荐答案

只需使用：

$('#menu-toggle').click(function(){
    $(this).find('i').toggleClass('glyphicon-arrow-right').toggleClass('glyphicon-arrow-left');
});

小提示示例

这篇关于如何在Bootstrap 3.2中点击它来更改字形？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！