javascript - 使用 jQuery 或纯 js 捕获键和触发函数

Question

我在表单中有一个文本区域：

<textearea id="message"></textarea>

键入时，每当用户在文本区域内键入字符#时，我想为之后键入的每个字符触发一个函数，直到用户按 Enter 键或空格键。

使用 jQuery 或纯 JS 怎么可能？

Answer 1

你可以使用这个：

var myCallback = function () {
    //put your code here
}

(function (callback) {
    var jMessage = $('#message'),
        callbackCallable = false,
        keycodeEnter = 13,
        keycodeSpace = 32;


    jMessage.keyup(function (e) {
        var lastLetter = jMessage.val().slice(-1);
        if (lastLetter === '#') {
            callbackCallable = true;
        } else if (e.keyCode === keycodeEnter || e.keyCode === keycodeSpace) {
            callbackCallable = false;
        } else if (callbackCallable) {
            callback();
        }
    });
}(myCallback));

Answer 2

如果您只想检测打字，您可以监听按键事件。

var anyHitYet = false;
jQuery('#massage').keydown(function (event) {

    if (anyHitYet) return;

    var key = event.keyCode;
    if (key === 51) {
        //call your function here
    } else if (key === 13 || key === 32) {
        anyHitYet = true;
    }
});

基本上如果它是 51 然后#被击中所以调用你的函数如果space或被enter击中你的-when-pressed-function 直到你再次#make 才会执行anyHitYet=false

有人可能会粘贴一些东西，所以这是一个不同的故事

Answer 3

不确定上述答案是否符合 OP 的要求。我认为第二个或第三个 # 也应该被监控，直到空格或返回结束监控。

// have a flag somewhere and initialize it to FALSE
var doMonitor = FALSE; 

$('#message').keydown(function(event){

    // trigger monitoring after # was tipped
    // (only once till space or return reset)
    if(event.keyCode == 51 && !doMonitor){
       doMonitor = TRUE;
    }
    else if(event.keyCode == 32 || event.keyCode == 13)
       doMonitor = FALSE;
    else if(doMonitor){
        // do whatever needs to be done
    }
});

您还可以向#message textarea 添加属性并将其删除（或更改其值），而不是使用变量。

// for setting an attribute
.attr( attributeName, value )

// for removing it
.removeattr( attributeName )

看这里http://api.jquery.com/removeAttr/和这里http://api.jquery.com/attr/