クリックイベントで要素の表示を切り替え
の編集
https://yassu.jp/pukiwiki/?%A5%AF%A5%EA%A5%C3%A5%AF%A5%A4%A5%D9%A5%F3%A5%C8%A4%C7%CD%D7%C1%C7%A4%CE%C9%BD%BC%A8%A4%F2%C0%DA%A4%EA%C2%D8%A4%A8
[
トップ
] [
編集
|
差分
|
バックアップ
|
添付
|
リロード
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
-- 雛形とするページ --
(no template pages)
[[jQueryめも]] 最初は非表示で、ボタンクリックで表示・非表示を切り替えます。 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> <script> $(function(){ $('#button').on('click', function() { if ($('#detail').css('display') == 'none') { $('#detail').slideDown(); $('#button').text('非表示'); } else { $('#detail').slideUp(); $('#button').text('表示'); } }); }); </script> <style> #detail { display: none; } </style> <button type="button" id="button">表示</button> <div id="detail"> 詳細内容 </div>
タイムスタンプを変更しない
[[jQueryめも]] 最初は非表示で、ボタンクリックで表示・非表示を切り替えます。 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> <script> $(function(){ $('#button').on('click', function() { if ($('#detail').css('display') == 'none') { $('#detail').slideDown(); $('#button').text('非表示'); } else { $('#detail').slideUp(); $('#button').text('表示'); } }); }); </script> <style> #detail { display: none; } </style> <button type="button" id="button">表示</button> <div id="detail"> 詳細内容 </div>
テキスト整形のルールを表示する