Hatena::ブログ(Diary)

手抜きぷろぐらまのメモ帳 このページをアンテナに追加 RSSフィード Twitter

2006-12-25

ASP.NET & JavaScriptでコード汚染をしないで2度押し防止

14:38 | ASP.NET & JavaScriptでコード汚染をしないで2度押し防止を含むブックマーク ASP.NET & JavaScriptでコード汚染をしないで2度押し防止のブックマークコメント

以前、attachEventでは複数イベントを登録して前のイベントの戻り値を見るというのができなくて悶絶していたが、結局やりたいことはイベント(メソッド)に対してアスペクトを適用すればよいということに気がつき、いろいろ調べた結果、すばらしいサイトをいくつか見つけ、早速コピペの雨あられで目的のものを完成

下のスクリプトを別ファイルにでもして、対象のHTMLにてインクルードすれば、全リンクとボタンにて2度押し防止機能が搭載できる

うひょぉぉ アスペクトすげぇぇ


// window の Load イベントを取得する。
window.onload = window_Load;
    
function window_Load() {
  var i;
  
  // 全リンクのクリックイベントを submittableObject_Click で取得する。
  for (i = 0; i < document.links.length; i ++) {
    var item = document.links[i]
    Object.Aspect.around(item, "onclick", checkLoading);
  }
  
  // 全ボタンのクリックイベントを submittableObject_Click で取得する。
  for (i = 0; i < document.forms[0].elements.length; i ++) {
    var item = document.forms[0].elements[i]
    if (item.type == "button" ||
      item.type == "submit" ||
      item.type == "reset") {
      Object.Aspect.around(item, "onclick", checkLoading);
      
    }
  }
  
  return true;
}

//2度押し抑止アスペクト
var checkLoading = function(invocation) {
  if (isDocumentLoading()) {
    alert("処理中です…");
    return false;
  }
  
  return invocation.proceed();
}

//画面描画が終わったかどうか
function isDocumentLoading() {
  return (document.readyState != null &&
          document.readyState != "complete");
}

//アスペクト用
Object.Aspect = {
  _around: function(target, methodName, aspect) {
    var method = target[methodName];
    target[methodName] = function() {
      var invocation = {
        "target" : this,
        "method" : method,
        "methodName" : methodName,
        "arguments" : arguments,
        "proceed" : function() {
          if (!method) {
            return true;
          }
          return method.apply(target, this.arguments);
        }
      };
      return aspect.apply(null, [invocation]);
    };
  },
  around: function(target, methodName, aspect) {
    this._around(target, methodName, aspect);
  }
}

パクリ元・・・もとい、参考サイト

実装
http://d.hatena.ne.jp/akm/20060917#1158449489
コピー元
http://d.hatena.ne.jp/masanobuimai/
アスペクトイパーイ
http://d.hatena.ne.jp/brazil/20061007/1160157179
おまけ
http://codezine.jp/a/article/aid/769.aspx

Javascriptのリファレンスはこれがすごく便利

第1版の頃から使ってます。

改訂第4版 JavaScript ポケットリファレンス
古籏 一浩
技術評論社
売り上げランキング: 26408

とおsるとおsる 2011/11/16 21:07 IE7で元の処理完了後に、あとからの処理が呼び出されている気がするがそういうものでしょうか?