https://tm.root-n.com/ Tue, 18 Nov 2025 23:12:15 +0900 FeedCreator 1.7.2-ppt DokuWiki https://tm.root-n.com/lib/images/favicon.ico https://tm.root-n.com/ https://tm.root-n.com/programming:javascript:jquery:anti_cache $.ajaxSetup({ cache: false }); or $.ajaxSetup({ ifModified: true }); programming:javascript:jquery Thu, 30 Jul 2009 14:41:51 +0900 https://tm.root-n.com/programming:javascript:jquery:anti_conflict prototype.js 等のライブラリと併用する時にコンフリクト対策を行う。 * 「$() 関数」は、jQuery 以外でも多くのライブラリが採用している為、コンフリクトが発生してしまう。 ライブラリのロード順序 * 例えば、prototype.js と併用する場合「jquery.js」は最後にロードします programming:javascript:jquery Mon, 15 Feb 2010 13:53:14 +0900 https://tm.root-n.com/programming:javascript:jquery:checkbox_like_radio <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript"> $(function(){ $("input[id^='chkbox_']").click(function(){ var flag = $(this).prop('checked'); $("input[id^='chkbox_']").prop('checked', false); if (flag) $(this).prop('checked', true); }); }); </script> <input type="checkbox" name="chkbox[]" value="1" id="chkbox_1"> 1<br> <input type="checkbox" name="chkbox[]" value="2" id="chkbox_2"> 2<br… programming:javascript:jquery Thu, 20 May 2021 17:07:33 +0900 https://tm.root-n.com/programming:javascript:jquery:checkbox_toggle <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript"> $(function(){ $("#toggle").click(function(){ $('.chkbox').attr('checked', $(this).attr('checked')); }); }); </script> <input type="checkbox" id="toggle"> toggle<br> <br> <input class="chkbox" type="checkbox" name="ids[]" value="1"> 1<br> <input class="chkbox" type="checkbox" name="ids[]" value="2"> 2<br> <input class="chkbox" type="checkbox" name="ids[]" value="3… programming:javascript:jquery Thu, 30 Jul 2009 14:42:37 +0900 https://tm.root-n.com/programming:javascript:jquery:continue_break jQuery には、ループ内で処理を飛ばしたり、抜けたりする命令である continue と break が用意されていない。 が、 return 命令 を使うことで同等のことが可能になる。 ｃｏｎｔｉｎｕｅ ループの先頭に戻る(処理を飛ばす) programming:javascript:jquery Thu, 13 Nov 2014 16:59:51 +0900 https://tm.root-n.com/programming:javascript:jquery:marshal_input_elements jqueryで、フォームの input要素 を整列させます。 * <table>タグを使わずに、きれいなレイアウトが実現できます。 <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript"> $(function(){ var max = 0; $("span.label").each(function(){ if ($(this).width() > max) max = $(this).width(); }); // ラベル左寄せ $("span.label").width(max).css({"float":"left", "clear":"both", "padding":"3px 0px 0px 0px"}); // ラベル右寄せ //$("span.label").width(m… programming:javascript:jquery Fri, 31 Jul 2009 11:17:01 +0900 https://tm.root-n.com/programming:javascript:jquery:onload * onload のタイミングで実行したい場合は以下のように記述する。 * 画像等も完全にロード完了していなければならない。 jQuery.event.add(window, "load", function(){ // ここに処理内容を記述します。 }); programming:javascript:jquery Thu, 06 Aug 2009 13:26:12 +0900 https://tm.root-n.com/programming:javascript:jquery:ready * DOMのロードが完了して、操作可能になったタイミングで処理を実行します。 * 画像等が完全にロードされてなくてもOK。 $(document).ready(function(){ // ここに処理内容を記述します。 }); programming:javascript:jquery Thu, 06 Aug 2009 13:25:48 +0900 https://tm.root-n.com/programming:javascript:jquery:reseize_image jQuery で、画像を指定サイズにリサイズして表示します。 サムネイルの表示に便利です。 * ※ 横幅と高さの比率は保ったままリサイズします。 <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript"> jQuery.event.add(window, "load", function(){ var fw = 100; //fixed width var fh = 100; //fixed height var sl = 'img.hoge'; //selector $(sl).each(function(){ var w = $(this).width(); var h = $(this).height(); if (w >= h) { … programming:javascript:jquery Thu, 30 Jul 2009 14:42:05 +0900 https://tm.root-n.com/programming:javascript:jquery:synchronized_select デモ デモのソース <script type="text/javascript" src="/path/to/jquery-1.4.2.min.js"></script> <script type="text/javascript"> $(function(){ $('.pulldown').change(function(){ $('.pulldown').val($(this).val()); }); }); </script> <select class="pulldown"> <option value="バナナ">バナナ</option> <option value="すいか">すいか</option> <option value="メロン">メロン</option> </select> 　 <select class="pulldown"> <option value="バナナ">バナナ</option> <option value="すいか">すいか</option> <option value="メロン">メロン</o… programming:javascript:jquery Fri, 10 Dec 2010 17:43:36 +0900