2012-08-13 4 views
7

私のWebアプリケーションで単体テストを書いていて、自動的に起動させたいたとえば、ダウンロードしたテキストファイルボタンをクリックした後に、私のページからキーを押したイベントを入力します。どのようにjQueryやJavascriptでこれを行うことができますか?あなたは自動的にsubmitイベントをトリガする Enterキーを入力することについて話している場合特定のアクションが実行された後にEnterキープレスイベントを自動的にトリガーする方法はありますか?

+0

探しているものですマウスクリックイベントの後にENTERキーが押されるようにするには? – themis

答えて

7
  1. ユーザーがボタンをクリックしたかどうかを示す変数を作成します。

    var clicked = false; 
    
  2. ユーザーがそれをクリックすると、clicked変数がtrueになりますように、あなたのボタンにイベントリスナーを追加します。

    myButton.addEventListener('click', function(){ 
        clicked = true; 
    }); 
    
  3. keypressイベントリスナーを追加:彼は、チェックしなかった(複数可)した場合、ユーザーが以前に

    if(clicked) { 
        // ... 
    } 
    
  4. クリックするかどうかを確認し、そのイベントリスナの内側に

    document.addEventListener('keypress', function(e) { 
        // `e` is the event 
    }); 
    
  5. を押されたキー。 Enterキーコードは、クリックする必要がないだろう、押されたキーが入力された場合は、ユーザーが自分のボタンをクリックし、入力して押した後、13

    var keynum = e.keyCode||e.which; 
    if(keynum == 13) { 
        // ... 
    } 
    
  6. が、そうでなければ、

    clicked = false; 
    

    を使用していますボタンをもう一度押します。

  7. その後、コードを実行します。たとえば、これは2秒後に機能fを呼び出します。私は右のあなたの質問を取得する場合

    setTimeout(f, 2000); 
    

ライブデモが

var clicked = false; 
 
document.querySelector('#btn').addEventListener('click', function(){ 
 
    clicked = true; 
 
    snippet.log("You clicked the button. `clicked` is now `true`"); 
 
}); 
 
document.addEventListener('keypress', function(e) { 
 
    if(clicked) { 
 
    var keynum = e.keyCode || e.which; 
 
    if(keynum == 13) { 
 
     clicked = false; 
 
     snippet.log("`clicked` is now `false`. Waiting 2 seconds..."); 
 
     setTimeout(f, 2000); 
 
    } 
 
    } 
 
}); 
 
function f() { 
 
    snippet.log("Function `f` executed successfully!"); 
 
}
#btn { 
 
    border: 3px solid red; 
 
    cursor: pointer; 
 
}
<div id="btn">Click me, and then press enter.</div> 
 
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --><script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

+0

これを試してみてください。そのコードで何が起きているのか説明できますか?私はjavaスクリプトの専門家ではないので、window.clickedまたはwindow.onclickを知らない。 –

+0

一定の時間を待つことは可能ですか?私はファイルのダウンロードウィンドウを待っているので、2秒後にトリガーしたい。 :) –

+0

素晴らしい。それは私が探しているものです。 :) どうもありがとう。 –

2

、あなたの代わりにこれを使用することができます:

$("#formID").submit(); 


がこのイベントをトリガするには、ボタンが押された後、してみてくださいこの:

$("#buttonID").click(function() { 
    $("#formID").submit(); // submits form 
}); 
+0

ボタンをクリックした後にトリガーしたい。私はハイパーリンクタグBTWを使用しています。 –

4

、 は、これはあなたが必要

<html> 
<head> 

    <script src="http://code.jquery.com/jquery-latest.js"></script> 

    <script type="text/javascript"> 
     $(document).keydown(function(event){ 
      if(event.keyCode == 13){     
       alert("keypressed"); 
      } 
     }); 

function clickevent() 
{     
    var e = $.Event("keydown"); 
    e.which = 13; 
    e.keyCode = 13; 
    $(document).trigger(e);  
} 
</script> 

</head> 
<body id="thebody"> 
    <input type="button" onclick="clickevent()" value="click me first"> 
</body> 
</html> 
+0

JavaScriptで同じことが可能ですか? –

+0

これは、テスト目的で使用する方が優れています。 – lft93ryt

関連する問題