javascript

AngularJS + jQuery + jQueryUI(ダイアログ) を試してみた

なんとなくTodoアプリを作ってみました。 実際に動くものは ここ で確認できます。独自ディレクティブについて。 リファクタリングすれば多少はきれいになるとは思いますが、 凝ったことをやろうと思うと結構考えないと、すぐにぐちゃぐちゃになりそうですね…

2階層以上のプロトタイプチェーンについて

「prototypeオブジェクトにベースオブジェクトインスタンスを設定したら、多重継承ってどうやるんだ??ベースクラスを設定したらサブクラスのprototype書き換えられないじゃん???」 という考えから抜け出せられず、また継承使わずとも十分実装できること…

カスタムオブジェクトの定義について

JavaScriptのprototype周りを勉強しながら、過去・現在の自分で書いたコードを見直したところ、 ちょっとまずい構成をしていたことが判明しました。例として以下のコードで考えます。 //ストップウオッチ var StopWatch = function(){ var _st = undefined; …

javascriptで再帰処理

こんな感じで書きました。 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title>再帰呼び出しサンプル</title> </head> <body> <p id="msg_aisatu1">おはよう</p> <p id="msg_aisatu2">こんにちは</p> <p id="msg_aisatu3">おげんきですか</p> <p id="msg_aisatu4">調子はどうだい?</p> <…</body></html>

属性値の取得、変更フック

jQuery1.6の新機能を試してみました。こんな感じで変更を感知できます。 参照元:jQuery1.6の更新内容をまとめたよ。 | Ginpen.com <html lang="ja"> <head> <meta charset="UTF-8" /> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("a").hover( f…</meta></head></html>

時間帯重複チェック

お題:時間帯重複チェック - No Programming, No Life だらだらとなってしまいました <html> <head> <script type="text/javascript"> var DateRange = function(stH, edH, stM, edM){ var checkHour = function(obj){ return 0 <= obj.stHour <= 24 && 0 <= obj.edHour <= 24; }; var checkMinitue = fu</head></html>…

apply関数

Functionオブジェクトのapply関数を呼び出すことで、thisを差し替えての関数呼び出しができる! 第2パラメーターには関数パラメーターを配列で指定する。 サンプルその1 <html lang="ja"> <head> <meta charset="utf-8"> <script type="text/javascript"> var Foo = function(msg){ this.msg = msg; }; Foo.prototype.getMessage = func</meta></head></html>…

コンストラクタ呼び出しパターン

JavaScriptTheGoodPartsより new演算子をつけて呼び出された関数(コンストラクタ関数)は、新しいオブジェクトが生成される。 コンストラクタ関数はnew演算子指定なしでも呼び出せてしまう。実行時に何も言われないので、使用に注意する必要がある。 コンスト…

jQuery Templates メモ

こんな感じで書いていきます。 <html> <head> <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js"></script> <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script> </head> <script type="text/javascript"> $(document…</html>

jQueryでのチェックボックスのチェック判定

下のような左端列にチェックボックスを持つテーブルに、選択行データの一括削除機能をjQueryで実装する。 テーブルと削除ボタンは、↓こんな感じで。... <table> <thead> <th> </th> <th>Id</th> <th>タイトル</th> </thead> <tbody> <tr class="detail-row"> <td class="del-col"><input type="checkbox" class="del-check" /></td> <td class="id-col">1000</td> <td>タイトル1</td> </tr> </tbody></table>

JavaScriptからアクションメソッド呼び出し

Tableのtrクリックイベントで、アクションメソッド呼び出しを行うといったことを実現するために こんなアクションメソッドを作成し、使用するViewで読み込み行う。public ActionResult HogeeUrl() { return JavaScript(String.Format("var hogeUrl = {0};", …

表組みの列合計値を求める

最下行の列合計を自動で算出するサンプル。 jqueryで対象要素の後ろに挿入する場合はafter関数を使用すること! また、挿入対象を一箇所に絞り込みたい場合はセレクタでそのように指定しないと、セレクタ指定全要素に挿入される!!(appendなども同様) add関…