当用户使用JavaScript键入内容时,如何设置搜索输入?

时间:2016-04-03 13:28:13

标签: javascript jquery keyboard-events

我创建了一个列出所有产品的应用程序,用户可以使用不同的方式搜索产品,其中一种是扫描条形码,通常,用户应该专注于搜索输入并扫描条形码,这样工作正常。

但是当输入(搜索输入)没有聚焦时,我想将其设为默认值,这样当用户键入内容或扫描条形码时,此输入会在keydown或keypress之前得到关注。

这可能吗?例如,如果我们可以在(keydown)或(keypress)之前获得一个事件,那么我们可以很容易地专注于输入。

(同样的想法,如果用户使用控制+粘贴剪贴板中的文本+ v聚焦并粘贴到其上的默认搜索输入)。

3 个答案:

答案 0 :(得分:1)

你在keydown之前不需要活动,你可以使用keydown:

$(document).bind('keydown',function(e){
    $('input').focus();
});

请参阅此jsfiddle example

答案 1 :(得分:1)

是的,如果您向窗口对象添加事件侦听器,则可以这样做。

示例:

jQuery(document).ready(function() {
  
  jQuery(window).keydown(function(ev) {
    
    if (ev.target.tagName === 'INPUT' || ev.target.tagName === 'TEXTAREA')
      return;
    
    jQuery('#mydefaulttextbox').focus()
      
  });
  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
This is my default input:
<input id="mydefaulttextbox" type="text" />

<p>
This is another input:
<input type="text" />
</p>

使用keydown绑定是因为只有在收到keyup或keypress事件时才会给角色留下印记。

答案 2 :(得分:0)

你也不需要jQuery。

<input type='text' id='bar_code_input' name='bar_code_input' />
<script type='text/javascript'>
 document.addEventListener('keypress', function(){
    var bc_input = document.getElementById('bar_code_input');
    bc_input.focus();
 });
</script>

https://jsfiddle.net/5d51z8rr/