JS:如何检测游标是否在文本字段中

时间:2013-03-26 12:33:21

标签: javascript html shortcut

我想使用一些字母(键)作为javascript中某些操作的快捷方式。我想检查光标是否聚焦在任何文本字段,表单输入等上,以便当用户在表单或文本字段中键入内容时,将取消快捷操作。

例如,我希望在用户按下“A”时执行alert()。但是,如果用户在“A网站”等文本区域中键入一些文本,那么他将按“A”,此时不应执行alert()。

7 个答案:

答案 0 :(得分:5)

$(document).keydown( function( e ) { 
  if( e.target.nodeName == "INPUT" || e.target.nodeName == "TEXTAREA" ) return;
  if( e.target.isContentEditable ) return;

  // Do stuff 
}

答案 1 :(得分:4)

window.onkeydown = function(e){
  if ( e.target.nodeName == 'INPUT' ) return;

  handle_shortcut();
};

答案 2 :(得分:3)

的jQuery

$(window).bind('keydown',function(e){
    if(e.target.nodeName.toLowerCase() === 'input'){
        return;
    }
    alert('a');
});

或纯粹的js

window.onkeydown = function(e){
    if(e.target.nodeName.toLowerCase() === 'input'){
        return;
    }
    alert('a');
};

除此之外你可以做的是定义一组非警报元素类型,所以inputtextarea等,然后检查这些元素当前都不是目标。

演示:http://jsfiddle.net/7F3JH/

答案 3 :(得分:1)

您可以根据当前焦点在页面上的元素来绑定和取消绑定快捷方式事件。

的JavaScript

window.onload = initWindow();

function initWindow () {
    attachShortcutHandler();

    var inputs = document.getElementsByTagName('input');
    for (var i = 0, max = inputs.length; i < max; i++) {
        inputs[i].onfocus = removeShortcutHandler;
        intputs[i].onblur = attachShortcutHandler;
    }
}

function removeShortcutHandler () {
    window.onkeypress = null;
}

function attachShortcutHandler() {
    window.onkeypress = function () {
        //your code here
    }
}

的jQuery

$(function () {
    initShortcutHandler();

    $('input, [any other element you want]')
        .on('focus', function () {
            $('body').off('keypress');
        })
        .on('blur', function () {
            initShortcutHandler();
        });
});

function initShortcutHandler() {
    $('body').on('keypress', function () {
       //do your stuff
    });
}

答案 4 :(得分:0)

jQuery mouseover()

 $('element').mouseover(function() {
      alert('over');
 });

答案 5 :(得分:0)

你需要将旗帜作为全球旗帜。并在任何文本框具有焦点时将其设置为false。

  

var flag = true;

     

$('input:type =“text”)。focus(function(txt){        flag = false; });

     
     

if(flag)//快捷键有效...

答案 6 :(得分:0)

更好地使用JQuery中定义的focusOut方法。根据我的理解,你可以做这样的事情

$("input").focusout(function() {
  if($(this).val() == "A"{
   alert("your message");
   return false;
  }else{
    //do other processing here.
  }
});

希望这会有所帮助:)