- ベストアンサー
jqueryの表示非表示に関する質問
- jqueryの初心者が表示非表示に関する質問です。display:noneで要素を非表示にして、クリックしたときに要素を表示するようにしたいのですが、2回クリックしないと表示されません。
- 質問内容は、jqueryの初心者が表示非表示に関する問題についてです。display:noneを使用して要素を非表示にしていますが、クリックしたときに要素が表示されない問題が発生しています。
- jqueryの初心者が表示非表示に関する問題について質問しています。要素の非表示にdisplay:noneを使用していますが、クリックしたときに要素が表示されない問題が発生しています。
- dark1981
- お礼率36% (4/11)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
toggle を使うと、表示・非表示のボタンが押された回数で１つ目のfunctionを実行するか２つ目のfunctionを実行するか決めていますので、クリアを押してもtoggleのカウンタが増えないためそのような動きになります。 [最初] => spanは非表示、toggleのカウンターは0 [表示・非表示クリック１回目] => spanは表示、toggleのカウンターは1 (1つ目のfunction実行) [表示・非表示クリック2回目] => spanは非表示、toggleのカウンターは2 (2つ目のfunction実行) [表示・非表示クリック3回目] => spanは表示、toggleのカウンターは3 (1つ目のfunction実行) [クリア クリック] => spanは非表示、toggleのカウンターは3 [表示・非表示クリック4回目] => spanは非表示、toggleのカウンターは4 (2つ目のfunction実行) JavaScriptのプログラム部分を以下のようにするとご希望の動きになります。 $(function() { $("#a01").click(function(){ var spantag = $(this).parent().next().children("span"); if(spantag.attr("class")=="text_h"){ spantag.attr("class","text_v"); }else{ spantag.attr("class","text_h"); } }); $("#clear").click(function(){ $(this).parent().next().children("span").attr("class","text_h"); }); });
その他の回答 (1)
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
jQueryはtoggleの状態を内部変数で保持しています。 http://okwave.jp/qa/q6130109.html No.8のように、.click()の中で、 if( $(略).attr("class")==="text_v" ){ $(略).attr("class", "text_h" ); }else{ $(略).attr("class", "text_v" ); } と分岐して、自前でtoggleの処理をするか、 またはNo.8お礼のコードのようなプラグインを作らないと行けないと思います。
お礼
ありがとうございます。まだまだ勉強しなければならないことが多いようです。
お礼
分かりやすい解説ありがとうございます。