javascript - 使用 css 或 javascript 在 html 页面中阻止键盘输入

Question

我有一个 <div> .

<div id="ViewActivitydiv" >
                @await Component.InvokeAsync("QuestionAnswers", new { activityQuestionAnswersList = Model.ActivityQuestionAnswers?.ToList() })
</div>

我的要求是这个<div> ，我不应允许用户使用键盘使用键盘快捷键或制表符或指针。

我试过了 tabindex="-1" , 但问题是组件模型在不同的页面中，并且不适用于组件模型中的所有控件。

谁能帮我做这件事？

Answer 1

这应该适用于所有键盘和鼠标输入:

$("#ViewActivitydiv").on("keydown keypress keyup click contextmenu", false);

#ViewActivitydiv {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

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

<div id="ViewActivitydiv">test</div>