jquery - javascript按键函数: case-insensitive a-z,数字和一些特殊字符？

Question

$('.s').keyup(function(e) {

    if (!/[A-Za-z0-9]/.test(String.fromCharCode(e.which))) {
        return false;
    }

我想知道最适合我的应用程序的正则表达式解决方案是什么。我有一个基于ajax的搜索，当按下实际字符(如a-Z(大写和小写)、数字，可能还有问号、破折号(连字符)和感叹号时)应该会触发搜索。还应启用空格键。

否则，如果按下shift键、option键或control键，也会触发ajax搜索。

这里最容易理解的正则表达式模式是什么？谢谢你的帮助

Answer 1

正则表达式的基本形式似乎很好，只需包含您想要包含的内容，并注意重音字符。或者，您可以排除您不想要的字符。

但我会使用 keypress 事件而不是 keyup 事件来实现此目的。 keypress 在键入实际可输入字符时触发，并在按键重复时触发(而即使按键重复，您也只会得到一个 keyup)。 keypress 对于 Shift、Meta、Ctrl 等不会触发。 更新:这不一定是真正的跨浏览器(叹息)，请参阅下面的更新。

如果您 Hook keypress，我可能不会过滤掉任何内容(不需要正则表达式)，因为我宁愿遵循浏览器及其对区域设置的感知真正的角色是由什么构成的。我可能还会添加一个短暂的延迟，以避免大量不必要的搜索。如果用户相当快地输入“fred”，则无需搜索“f”、“fr”和“fre”。

这是我的意思的一个例子(将keypress与轻微的延迟结合起来)。如果您确实想过滤掉某些字符，可以在事件处理程序中执行此操作，但由于上述原因，我没有这样做:

HTML:

<input type='text' id='theText'>

JavaScript(使用 jQuery，因为您使用 jquery 标记了您的问题):

jQuery(function($) {
  var searchTimer = 0;

  $('#theText').keypress(function() {
    if (searchTimer != 0) {
      clearTimeout(searchTimer);
    }
    searchTimer = setTimeout(doSearch, 250);
  });

  function doSearch() {
    searchTimer = 0;
    display("Search: '" + $('#theText').val() + "'");
  }

  function display(msg) {
    $('<p/>').html(msg).appendTo(document.body);
  }
});​

Live copy

该示例在它看到的最后一个按键后四分之一秒进行搜索；根据需要将参数调整为 setTimeout。

<小时/>

更新:在您对箭头键发表评论后，我想“但是您在keypress上看不到箭头键，是吗？”答案是:你可以在 Opera 和其他几个平台上使用。 叹气所以是的，使用过滤器:

$('#theText').keypress(function(event) {
  // Magic numbers from http://unixpapa.com/js/key.html
  switch (event.keyCode) {
    case 37: // Left
    case 38: // Up
    case 39: // Right
    case 40: // Down
      break;

    default:
      // A "real" key, include it
      if (searchTimer != 0) {
        clearTimeout(searchTimer);
      }
      searchTimer = setTimeout(doSearch, 250);
  }
});

function doSearch() {
  searchTimer = 0;
  display("Search: '" + $('#theText').val() + "'");
}

Live copy (这个只是过滤掉箭头键；您需要扩展它)

如果您还不知道，this page对于有关跨浏览器键盘事件的疯狂信息非常有用。它可能有点过时。