如何检测空格是否被删除或后退删除？

Question

我需要找到一种方法来检测是否删除了空格或使用了退格键，如果是这样就运行一个函数。我正在使用JavaScript / jQuery进行开发。

我知道可以使用以下代码监听删除或退格键：

$(this).keyup(function(event) {
        event.keyCode

然而，我不知道如何判断删除或退格命令是否删除了一个空格？非常感谢任何建议。

- Baxter

---

当您检测到删除或后退键按下时，需要检查输入元素中插入符的当前位置，并检查其前/后是否有将被删除的空格。 - koopajah

你需要检测的只有空格还是可能与文本混合？ - dmi3y

@dmi3y 我只需要检测空格被删除了。我有其他处理多个字符删除的东西。 - Baxter

如果一个空格和一个字符都被删除了怎么办？为什么需要分别检测这两个东西？检测它们同时进行不是更合理吗？ - Kevin B

这是用来做什么的？你能提供一些上下文吗？ - Kevin B

Answer 1

绑定 keydown 事件并比较前后的值，以查看是否减小了大小。

$(input).keydown(function(){
    var currVal = this.value, self = this;
    setTimeout(function(){
        if ( currVal.length > self.value.length ) {
            console.log(currVal.length - self.value.length + " characters have been removed.");
        }
    },0);
});

http://jsfiddle.net/ymhjA/1/

Updated sample:

$("input").keydown(function() {
    var currVal = this.value,
        self = this;
    setTimeout(function() {
        if (currVal.length - self.value.length === 1) {
            var origVal = $.grep(currVal.split(""),function(val){
                return val === " ";
            });
            var newVal = $.grep(self.value.split(""),function(val){
                return val === " ";
            });
            if ( origVal.length != newVal.length ) {
                console.log("a space was removed");
            }
        }
    }, 0);
});​

http://jsfiddle.net/ymhjA/4/

- Kevin B

---

这并没有回答楼主的问题。 - Shmiddty

@Shmiddty：是的，任何通过任何方法删除空格都会在这里显示出来。 - Phil H

@Shmiddty 唯一的方法是添加一个for循环，遍历每个字符，以查看已删除的字符是否为空格。在编写此类代码之前，我宁愿从OP那里获得一些澄清。 - Kevin B

@Baxter 你需要循环遍历字符串中的每个字符，直到找到被删除的一个或多个字符。这是否需要处理一次删除多个字符的情况，其中一个是空格？ - Kevin B

最新更新检测是否通过任何方式删除了单个空格。 - Kevin B

Answer 2

请看这里：http://jsfiddle.net/Txseh/

(function(){
    var currentWhitespaceCount;

    $("input").keyup(function(e){
        var newCount = ($(this).val().match(/\s/g) || []).length;

        if (newCount < currentWhitespaceCount)
            alert("You removed one or more spaces, fool.");

        currentWhitespaceCount = newCount;
    });
})();​

它会跟踪输入中当前空格字符的数量，如果数量减少，它会发出警报（或执行您想要的任何操作）。

- Shmiddty

Answer 3

提前缓存值（在键按下时设置一个值），然后将其与键按下后的值进行比较。这是唯一确定一个或多个空格已被删除的方法。任何键的检查都依赖于您能够确定可能的键可以实现删除空格，并且可能会留下漏洞。

例如，选择单词的最后一个字母和其后面的空格，如果我们按下最后一个字母，它将删除空格。但按下的键不是退格键或删除键。

- Phil H

---

没问题，每个字符都在 keyup() 上调用该函数。我想要单独处理退格和删除，并且仅当删除或退格移除了一个空格时才调用该函数，否则我想忽略这些命令。 - Baxter

你能提供一个示例，说明我如何在按键之前缓存值并与按键后的值进行比较吗？ - Baxter

@KevinB：确实。我看到你的答案出现时，我正在发布我的答案，它完全做到了这一点。也许可以通过操纵事件原型并在事件冒泡中第二次捕获来使其同步，但那将需要更多的努力并且是有问题的。 - Phil H

Answer 4

这是我的代码 http://jsbin.com/atuwez/3/edit

 var input = $('#input'),
     afterLength,
     beforeLength;

input.on({
  'keydown': function () {
    beforeLength = input.val().split(/\s/).length;
  },
  'keyup': function(event) {
    var key = event.keyCode || event.charCode;

    if( key == 8 || key == 46 ) {
          afterLength = input.val().split(/\s/).length;
          console.log(beforeLength == afterLength);
    }
  }

});

- dmi3y