web-dev-qa-db-ja.com

Webサイトでの訪問者の「Ctrl + F」の使用を追跡しますか?

理論的には、ユーザーがWindowsショートカットを使用してWebページを照会した場合に(JavaScriptなどを介して)検出することは可能でしょうか Ctrl + F、またはMacに相当するもの Command + F ブラウザで?

最初のステップは、その関数が呼び出されたかどうかを検出することですが、キーストロークを追跡するのは別の球技です...


多くの場合、ウェブアプリはキーボードショートカットを他のことを行うために再配線するように思われます(または、HTML5 canvasの一部の場合、ショートカットが完全に無効になります Command + W タブを閉じることはできません)。これはおそらく別のメカニズムであり、私は大きな期待を持っていません。さらに、 ユーザーの約10%のみ の使用方法を知っている Ctrl + F とにかく機能します。

7
Baumr

イベントキーボードをキャプチャする場合 Ctrl + F ブラウザの標準検索ボックスを開いて、次の操作を実行できます。

var KEY_CTRL = 17;
var KEY_f = 70;

var isReserved = false;
var useExclusiveKeyEvent = false;
var isNewSearchEvent = false;


/*THIS VARIABLE IS RENDERED BY SERVER SIDE*/
var clientRandomKey = "78349DE472AA30032DE2DF344FF28374";

window.onkeyup=function(ev){
  if(ev.which == KEY_CTRL){
    isReserved=false;
  }
}
window.onkeydown=function(ev){
  //!IMPORTANT NOT MAKE UI DELAY IN THIS FUCTION
  if(ev.which == KEY_CTRL) {
       isReserved=true;
  }
    if((isReserved==true)&&(ev.which == KEY_f)) {       
    var currentDate = new Date();
    console.log( "INTO EVENT FUNCTION >\n   "+ currentDate+ " \n   ID: "+clientRandomKey+"\n   launch search a Word");
    isNewSearchEvent=true;
    if(useExclusiveKeyEvent){
      return false;}
    }
}

window.setInterval(function(){            
    if(isNewSearchEvent){
      isNewSearchEvent=false;
      //TODO ajax send code
      var currentDate = new Date();
      var msg = "OUTSIDE EVENT FUNCTION >\n   " + currentDate+ " \n   ID: "+clientRandomKey+"\n   launch search a Word"
      console.log(msg);
      alert(msg);
    }
},2500);

これは実際の例です

この例でわかるように、ユーザーが正しいキーボードの組み合わせを押すと、イベント関数はフラグ(isNewSearchEvent)の状態を変更しながら、コンソールで"log string"を送信します( "EVENT INTO FUNCTION")。

このフラグは、コンソールで別の"log string"を送信するためにタイマーで評価されます(「外部イベント機能」)

同じメッセージでアラートを開きます。

log console

イベント関数にブレークを作成できず、正しいキャプチャ速度でリッスンする必要があるため、この二重パッセージが必要です。

3
RTOSkit

はい、可能です:

$(document).ready(function(){
  ctrl = false;
  document.addEventListener("keydown", function(e){
    if(e.which == 17){
      ctrl = true;
    }
    if(e.which == 70 && ctrl == true){
      e.preventDefault();

    }
  }, true);

  document.addEventListener("keyup", function(e){
    if(e.which == 17){
      ctrl = false;

    }
  });
});

そして.preventDefault()で通常のイベントをキャンセルします。しかし、コマンドキーについてはわかりません。jQueryを使用している場合、そのe.metaKeyと言う人もいます。問題は、コマンドキーが各ブラウザーで同じJavaScriptキーコードを持たないことであるため、手動で処理する必要があります。そうしないとjQueryが役立ちます。

テストする場合 http://jsfiddle.net/a5t2q/

編集:「結果」セクションをクリックして、Ctrl + Fがブロックされていることを確認する必要があります。このセクションは、この場合「ドキュメント」と呼ばれるためです。

4
user1455261