QKAKE::TECH

テックなことを書く

クリックで文字を切り替える【jQuery】

テキストを切り替えるときはckick()関数を用いると簡単。

//id=sampleとしてある範囲のテキストを取得する
$('#sample').text();
//id=sampleとしてある範囲のテキストを置き換える
$('#sample').text("変更しました。");

これを応用して、toggle()関数の「表示」・「非表示」のようにボタンを押して「変更前」・「変更後」と切り替わるようにしたい。
toggle()とclick()を使ってどうにかしようとしたが、if文を用いて書いてあげると簡単だった。

$(function(){
  var flg = "default";
  $('#item_detail button.see_more').click(function(){
    if(flg == "default"){
      $(this).text("閉じる");
      flg = "changed";
    }else{
      $(this).text("もっと見る");
      flg = "default";
    }
  });
});

参考

改訂版 Webデザイナーのための jQuery入門

改訂版 Webデザイナーのための jQuery入門