按键事件未在移动设备上运行 [英] keypress event is not running on a mobile device

问题描述

我遇到的问题是，当用户在移动设备浏览器上键入内容时，事件处理程序没有运行.

the problem I am having is that the event handler isn't running when the user types on mobile devices browsers.

我的javascript代码的工作方式如下::当用户编写内容并按空格键时，javascript代码会自动为标签系统添加#(diez)标记.就像您编写:this is test message一样，javascript代码将其更改为:#this #is #test #message都在空格之后.

My javascript code working like this: When user write someting and press space javascript code automatically adding #(diez) tag for hashtag system. Like if you write: this is test message, javascript code change it like this: #this #is #test #message all after space.

如果您在计算机浏览器中选中 DEMO (Chrome, Safari, Firefox, Opera )，它工作正常.

If you check this DEMO on your computer browser (Chrome, Safari, Firefox, Opera) it is working fine.

但是，如果您在移动浏览器事件处理程序上选中此 DEMO ，当您键入某物时，它不会运行.

But if you check this DEMO on your mobile browsers event handler isn't running when you types someting.

$("body").on("keypress","#text", function(e) {
     var code = e.charCode || e.keyCode || e.which;
    if (charactersX.has(code)) {
      var text = $("#text").text();
      text = addHashtags(text);
      $("#text").text(text);
      placeCaretAtEndX(document.querySelector("#text"));
      console.log(text);
    } else if (forbiddenCharactersX.has(code)) {
      e.preventDefault();
      console.log("something");
    }
  });

完整代码为 这里 .

Full code is HERE.

推荐答案

我用此代码替换了代码的$(document).on("keypress", "#textInpu", function(){.....})部分，该错误消失了:

I replaced the $(document).on("keypress", "#textInpu", function(){.....}) part of your code with this and the bug is gone:

   $(document).on("textInput", "#text", function(event) {
      var code = event.originalEvent.data.charCodeAt(0);
      if (charactersX.has(code)) {
         // Get and modify text.
         var text = $("#text").text();
         text = addHashtags(text);
         // Save content.
         $("#text").text(text);
         // Move cursor to the end
         placeCaretAtEndX(document.querySelector("#text"));
      } else if (forbiddenCharactersX.has(code)) {
         e.preventDefault();
      }
   });
});

如果您想知道，这就是您的问题: Android上的keyCode始终为229

用我提供的代码替换代码后，如果有任何错误，请告诉我.

This was your issue if you are wondering: keyCode on android is always 229

If there are any bugs after you replace your code with what i provided, please let me know.

这篇关于按键事件未在移动设备上运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！