river_gg
river_gg
2017-09-10 07:39
采纳率: 87.5%
浏览 3.1k
已采纳

（小白）JS/JQ怎么实现点击一个小图标隐藏一个div并且图标更换为另一个

小白虚心请教，这一块真的不是很懂，问题如题：JS/JQ怎么实现点击一个小图标隐藏一个div并且图标更换为另一个，再次点击显示内容，并且图标还原。各位大佬，如果能给个例子代码就更好了。谢谢啦(可以使用bootstrap)

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

4条回答 默认 最新

  • zhwyj1019
    innerpeacez 2017-09-11 04:13
    已采纳 
     <script>
        $(function () {
            $("#btn1").click(function () {
                $("#d1").slideToggle();
                $("#d2").slideToggle();
            });
        });
    </script>
    </head>

    <body>
        <div id="d1" style="width: 100px; height: 100px; border: 1px solid blue;float: left; display: none;"></div>
        <div id="d2" style="width: 100px; height: 100px; border: 1px solid red;float: left;"></div>
        <div style="float: left;">
            <input type="button" id="btn1" value="click" />
        </div>
    </body>
    点赞 评论
  • river_gg
    river_gg 2017-09-10 09:13

    大佬呢！！！~~~~~~~~~~~~~~~~~~~~~~~~~~

    点赞 评论
  • baidu_35975930
    阴鸦 2017-09-10 13:48

    报名

    第一个div
    第二个div

    function btn1(){
    document.getElementById('div1').style.display='block';
    }
    function btn2(){
    document.getElementById('div1').style.display='none';
    document.getElementById('div2').style.display='block';
    }
    function btn3(){
    document.getElementById('div2').style.display='none';

    }

    点赞 评论
  • sunny_desmond
    carrykingdow 2017-09-11 01:29

    jq的话 你可以试一下toggle，看看这个文章 你可以toggle一个class ，这样应该很容易实现~

    点赞 评论
提交

相关推荐