检测班次键输入事件

时间:2016-01-12 08:16:47

标签: javascript jquery html

我需要检测一个移位键输入,该输入持续5秒并需要执行某些功能。

是否可以在javascript / JQ中,事件识别保持5秒的shift键条目?

请帮忙, 提前谢谢。

3 个答案:

答案 0 :(得分:2)

这样可行!



$(function () {
  var tmr = 0;
  $(document).keydown(function (e) {
    if (e.shiftKey == true)
      tmr = setTimeout(function () {
        $("#status").append("You held the Shift key for 5 seconds!<br>");
        clearTimeout(tmr);
      }, 5000);
  }).keyup(function (e) {
    if (e.shiftKey == false)
    clearTimeout(tmr);
  });
});
&#13;
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<div id="status">
  Ready...<br>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

选中此fiddle

[vPopup setHidden:NO]

答案 2 :(得分:0)

Check this

var text_area 					= null;
var shift_key_press_duration 	= 3 * 1000; /* 5 seconds. */
var key_down 					= function(event) {

	if (event.keyCode == 16) {
		var d = new Date();

		if(text_area.attr( 'data-time') == 0) {
			text_area.attr( 'data-time', d.getTime() );
		}

		if( (d.getTime() - text_area.attr( 'data-time'))  >= shift_key_press_duration ) {
			$('#event').append( '<li>Event triggered at: ' + d  + "</li>");

                        alert('Bla');

			text_area.attr( 'data-time', '0');
		}
	}
	
};

var key_up 						= function(event) {
	text_area.attr( 'data-time', '0');
}


$(document).ready(function() {

	text_area = $('#textarea');
	

	text_area
		.on('keydown', key_down)
		.on('keyup', key_up);


});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Event:
<ul id="event" style="border: 1px solid blue; min-height: 100px; "></ul>

<br><br>

<textarea id="textarea" style="width: 400px; height: 200px;" data-time="0">

Hold shift key for 3 seconds in this textarea

</textarea>