javascript - jquery slideToggle變換icon圖示?
黄舟
黄舟 2017-04-11 10:33:50
0
1
443
<a class="floor_link" id="floor_btn01">按鈕 <i class="material-icons floor_icon">keyboard_arrow_down</i></a>
  <p style="background-color:#eee; width:100%; height:1px;"></p>
      內容
    </p>
$("#floor_btn01").click(function() {
  $("#floor_btn01show").slideToggle();
  $("#floor_btn01").html('按鈕 <i class="material-icons floor_icon">keyboard_arrow_up</i>');
});

我是想當按按鈕之後,能夠從 keyboard_arrow_down 變換到 keyboard_arrow_up
然後再按一次的話 則是從 keyboard_arrow_up變換到 keyboard_arrow_down
但是我是使用 slideToggle() 去讓他有展開縮放的效果
所以上面是換到 keyboard_arrow_up後就換不回keyboard_arrow_down
要如何做到這樣切換icon呢?

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

reply all(1)
PHPzhong
 $("#floor_btn01").html('按鈕 <i class="material-icons floor_icon">keyboard_arrow_up</i>');

换成

 if($("#floor_btn01").text().indexOf("up")==0){
     $("#floor_btn01").html('按鈕 <i class="material-icons floor_icon">keyboard_arrow_up</i>');
 }else{
     $("#floor_btn01").html('按鈕 <i class="material-icons floor_icon">keyboard_arrow_down</i>');
 }
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template