如何在 jquery 按键事件中获取整个单词（不是整个值）？

Question

我正在做一个项目，当您在按键事件中输入文本区域时，我想将每个单词大写。现在，我只从几个单词开始，例如 SELECT、FROM 和 WHERE，在 MySQL 中默认称为 reserved word。

我创建了一个数组来存储这些单词。但是现在我面临的问题是如何在您键入字母时获得整个单词。

我从其他 Whosebug 线程那里得到的帮助很少，但是我无法获得任何类型的帮助来在您键入字母时获取整个单词的值。

示例：原始字符串将是这样的 select name from accounts where id = '123'

当你在上面输入字符串时，结果应该是这样的 SELECT name FROM accounts WHERE id = '123'

到目前为止，我可以将textarea中的唯一一个单词大写，但是当我尝试输入整个单词时却无法做到这一点sql。下面找到我正在使用的代码

$("#test").keyup(function () {
    var arr = ['SELECT', 'FROM', 'WHERE'];
    for (var i in arr) {
        if(arr[i].toUpperCase().indexOf($(this).val().toUpperCase()) == 0){
            $(this).val($(this).val().toUpperCase());
            break;
        }
    }
});

Answer 1

您可以使用正则表达式（忽略大小写）替换 val() 中的所有单词，如下所示：

$("#test").keyup(function () {
    var arr = ['SELECT', 'FROM', 'WHERE'];
    for (var i in arr) {
        // "i" ignores case and "g" makes the search global
        var regEx = new RegExp(arr[i], "ig");
        $(this).val($(this).val().replace(regEx, arr[i]));
    }
});

Answer 2

将字符串拆分 spaces 并映射结果数组，然后用 space

加入

var $input = $("#test").on('input',function () {
    var arr = ['SELECT', 'FROM', 'WHERE'];
    $(this).val(function(_, currVal){
        return currVal.split(' ').map(function(word){
            return arr.includes(word.toUpperCase())? word.toUpperCase() : word;
        }).join(' ')
    })
})

// set value and trigger event for demo
$input.val("select name from accounts where id = '123'").trigger('input');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="test" style="width:100%">

Answer 3

您可以将单词边界 \b 与正则表达式一起使用，甚至可以使用 input 来检测字符串

的复制粘贴

$("#test").on('input', function() {
  var arr = ['SELECT', 'FROM', 'WHERE'];
  let elem = $(this);
  for (var i = 0; i < arr.length; i++) {
    let regex = new RegExp('\b(' + arr[i] + ')\b', "gi");
    elem.val(elem.val().replace(regex, arr[i]));
  }
});

textarea {
  width: 100%;
  height: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="test"></textarea>

如何在 jquery 按键事件中获取整个单词（不是整个值）？

How to get a whole word(not whole value) on jquery keypress event?

jquery

mysql

capitalization

reserved-words