Category / JavaScript
【Javascript】テキストエリアに入力した文字数を数える
2012-05-26 問題 Javascriptで、テキストエリアに入力した文字列の文字数を数えてください。 答え demo テキストエリアの文字列の文字数は 文字です。 source <textarea onkeyup="d […]
【jQuery UI】datepickerで年/月/日で別々のフォームにしたい時
2012-05-03 問題 jQueryUIのdatepickerは、基本は1つのinputに対してのみ処理を行うようにできていますが、年、月、日の3つに分けて入力させるにはどうするとよいでしょう。 答え ・カレンダーを開く際には3つの年月日 […]
【jQuery】リストをページ分けしてjqueryuiのタブにする
2012-05-02 ある長いリストがあるとき、そのHTMLのプレーンなリスト(ulとliのリスト)を、スクリプトで変形し、1-10、11-20…のように区切って、jqueryuiのtabsを適用し、縦に短くし、タブ切り替えで閲覧できるように […]
【jQuery】長いリストを短くして「もっと見る」をつける
2012-04-27 リストで、あまりに長くなって邪魔な場合があると思います。 例えば、WorPressの年月日のアーカイブの一覧が、3年ぐらいたつと36個もできてしまう。 普段は上10個ぐらいあれば十分。でも件数制限して画面から消してしまう […]
【jQuery】jQuery.grep を使ってみる
2012-04-24 $.grep(配列, 判定用関数) を使うと、配列の中から判定用関数がtrueを返したものだけを取り出すことができます。 使用例1 3の倍数だけを取り出す。 var a = [78, 96, 32, 3, 45, 7, […]
【JavaScript】~~ で小数の切り捨て(ビット演算子 ~2つで0方向へ切り捨て)
2012-04-23 問題 これ、なんですか。この、にょろにょろ。 var y = ~~(x/2); 答え ビット否定演算子(Bitwise NOT Operator)を2つ~~使うと、小数の切り捨てができる。 >>> ~~ […]
【jQuery】jQuery.each を使ってみる
2012-04-22 $.each(配列 or オブジェクト, コールバック) を使うと、for文でループするのと同じことができます。 $.eachって何? jQueryにはいくつか便利機能が付いています。 http://api.jquery […]
jQueryUIのdialog(ダイアログ)の優雅な使い方
2012-04-17 通常のマニュアルのとおりにjqueryuiのダイアログを使うと、画面上にダイアログ用の要素を仕込んでおく形になります。 例) <script> $(function() { $("#dialog").dial […]
【jQuery】今見えているかどうか、表示しているかどうかを取得する
2012-04-11 画面上の要素を表示したり非表示にしたりすることがあるけど、今表示しているかどうかが取得できる方法です。 今非表示のものにマッチするセレクタがあります。 :hidden jQueryで、セレクタにマッチする要素があるかどう […]
【jQuery】クリックなどのイベントを発生させる
2012-04-08 .trigger()を使います。 例えばid=”sample”に対してclickイベントが登録されているとして、 $('#sample').on("click", function(){ aler […]
【Javascript】配列のコピー
2012-03-25 問題 配列のコピーをしたいんだけど、コピー元を変更すると、コピー先も変わってしまう! var a = [0,1,2,3]; var b = a; a.pop(); // aから1つ要素を抜き出す alert(b); // […]
セレクトボックスの内容(option)を消す書き方の例
2012-03-15 例1 id=”target” の要素の中身を空にする → select要素の中の子要素、テキストノードがなくなる。 $('#target').empty(); 例2 id=”targe […]
【Javascript】iframeの内容を取得したい
2012-03-12 問題 iframeの内容を取得したいのだが、なぜか取得できない。 <script> //iframe要素を作る $('body').append('<iframe id="example1" src=" […]
++[[]][+[]]+[+[]] は “10”
2012-03-09 問題 ++[[]][+[]]+[+[]] は 10 になる。 なんで!??? 確認: ← クリックすると alert(++[[]][+[]]+[+[]]) します。 答え 以下、過程(細かいところは下に補足説明)。 ++ […]
ページの下までスクロールしたときに何らかの処理を実行する例
2012-03-08 ページの下までスクロールしたときに何らかの処理を実行する例 $(window).bind("scroll", function() { scrollHeight = $(document).height(); scrol […]
jQueryで右クリックをできなくする
2012-03-05 問題 jQueryで右クリック禁止をしたい。 答え $(function(){ $(document).bind("contextmenu",function(e){ return false; }); }); demo […]
URLのハッシュを監視する(#, シャープ, フラグメント識別子)
2012-03-01 twitterやfacebookのURLのような、# や #! の活用例。 #以降の文字列はサーバーには送られないため、javascriptで認識、区別する。 今どきのWebブラウザはページ内リンクなどでハッシュに変化が […]
【Javascript】配列の値の中から、最大値、最小値を求める(配列を引数に展開する)
2012-02-27 問題 Javascriptで、数値の配列から、最大値、最小値を求めよ。 答え var a = [3, 1, 4, 1, 5, 9, 2, 6]; Math.max.apply(null, a); // → 9 Math. […]
【jQuery】.on() の使い方(jQuery1.7~)
2012-02-25 jQuery1.7から、.bind()、.live()、.delegate()などは非推奨となり、.on() が推奨となりました。今後すべてのイベントは .on() で、となっていきそうですが、なにやら引数が多くて分かり […]
【jQuery】ちょっとシンプルなアコーディオンメニュー
2012-02-23 問題 ぱたぱた開閉するメニューを作りたい。 開いたり閉じたりしたら、ページを移動しても状態を維持して欲しい。 答え 前回のアコーディオンメニューよりちょっと機能追加したバージョンです。 開いた位置を記憶しておいて新しく開 […]