Question

我已经定义了键盘事件，这些事件在桌面上运行良好但触摸设备没有获得屏幕键盘事件。如果用户正在输入，我需要捕获。我使用了以下代码段：

$('#id').keydown(function(e){
  //some code here
});

$('#id').keyup(function(e){
  //some code here
})

我希望keydown和keyup中定义的代码能够触发触控设备（平板电脑和手机）。请建议如何捕获屏幕键盘事件并使上述代码运行。

Answer 1

您是否尝试使用按键而不是按键

$("#id").keypress(function() {

});

更新：

由于安卓问题，我现在通常会像这样包装我的支票

if ($.browser.mozilla) {
    $("#id").keypress (keyPress);
} else {
    $("#id").keydown (keyPress);
}

function keyPress(e){
    doSomething;
}

Answer 2

解决此问题的一种方法是在setInterval或keyup时使用keydown 未检测到var keyUpFired = false; $('#input').on('keyup',function() { keyUpFired = true; // do something }); if( keyUpFired === false) { setInterval(function() { if($('#input').val().length>0) { // do something } },100); }个事件。

Materialize

以下是使用$(document).ready(function() { var keyUpFired = false; $('#input').on('keyup',function() { keyUpFired = true; if ($('#input').get(0).checkValidity() === true) { $('label[for="input"]').attr('data-success','Custom Success Message: You typed...'+$(this).val()); } else { $('label[for="input"]').attr('data-error','Custom Error Message: Username too small'); } validate_field($('#input')); }); if( keyUpFired == false) { setInterval(function() { if($('#input').val().length>0) { if ($('#input').get(0).checkValidity() !== false) { $('label[for="input"]').attr('data-success','Custom Success Message: You typed...'+$('#input').val()); } else { $('label[for="input"]').attr('data-error','Custom Error Message: Username too small'); } validate_field($('#input')); } },100); } });测试触控设备的小例子。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css" rel="stylesheet"/>
 <div class="row">
    <form class="col s12">
      <div class="row">
        <div class="input-field col s12">
          <input placeholder="5-20 characters..." id="input" pattern=".{5,20}" type="text" class="validate">
          <label for="input" data-error="wrong" data-success="right">Username</label>
        </div>
      </div>
    </form>
  </div>

Error while working with the class: java/lang/annotation/Annotation file:com_we4it_aveedo_TestAnno no class definition

Answer 3

此页面的最后一个答案有效： How can I get jquery .val() AFTER keypress event? -

基本上丢弃＆＃34; keyup＆＃34;并改为＆＃34;输入＆＃34;，类似于： $（document）.delegate（＆＃39;＃q＆＃39;，＆＃39;输入＆＃39;，功能（e）{etc}

如何捕获触摸设备的屏幕键盘'keydown'和'keyup'事件

3 个答案: