PreventDefault 不适用于焦点事件

2024-02-11

我正在尝试设计一种表单,如果它具有特定的类,则用户应该无法与任何输入进行交互。由于各种原因,我想避免使用“disabled”属性。我试图阻止焦点事件的默认设置,但它不起作用。我在最新版本的 Firefox、Chrome 和 Android 中对此进行了测试。我尝试了各种事件组合,例如“单击更改触摸启动焦点焦点”。我尝试输入“return false;”在处理程序中。有谁知道为什么会发生这种情况以及如何使其发挥作用?

<!DOCTYPE html>
<html><head>
<title>input test</title>
</head>
<body>
<form class="disabled">
  <input type="text">
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(".disabled :input").bind("focus", function(e) {
  e.preventDefault();
});
</script>
</body></html>

您可以在以下位置查看示例http://jsfiddle.net/54Xka/ http://jsfiddle.net/54Xka/

EDIT:这将位于一个主要针对移动浏览器的网站上。我计划在显示模式对话框时禁用输入。模式对话框是使用我自己的代码实现的。显示和隐藏 div 是非常简单的事情。

EDIT 2:这就是我现在所拥有的:

$(".disabled :input").live({
  focus: function() {
    $(this).blur();
  },
  change: function(e) {
    e.preventDefault();
  }
});

它有一些小的美学问题,但它确实有效。当我有更多时间时,我可能会使用透明 gif 尝试 jfriend00 的想法,或者类似于 jQuery UI 对话框小部件所做的事情,或者实际上使用 jQuery UI 对话框小部件来实现对话框。


对于文本字段,最好的办法是将它们设置为只读。这仍然允许选项卡和复制,但不允许修改。

<input type="text" readonly="readonly" value="Can't change me">

如果您还想停止按 Tab 键,则功能正常的网页支持在页面上用于键盘访问的对象之间进行键盘导航。这意味着任何只是试图阻止焦点的选项都会中断任何通过键盘导航网页的尝试。因此,最好通过告诉浏览器该对象不是制表符停止位来阻止项目之间的制表符切换,并且当按下 Tab 键时它会很高兴地跳过它。您可以通过将对象的 tabIndex 设置为 -1 来实现此目的。键盘导航将永远不会停止,但会按预期工作。

<input type="text" readonly="readonly" tabIndex="-1" value="Can't change me or tab to me">

如果您使用的对象类型与文本字段不同,请更具体地说明对象类型。在诉诸扰乱网页预期功能的脚本之前,您应该追求支持您预期行为的 HTML 属性。如果您不希望用户能够与其交互,那么使用除用户可编辑标签之外的其他内容来仅显示数据(如 div)也可能是有意义的。

您可以在此处查看 readonly 和 tabIndex 字段的示例:http://jsfiddle.net/jfriend00/9wWkQ/ http://jsfiddle.net/jfriend00/9wWkQ/

现在,听起来我们有移动的规格。现在您说您甚至不希望他们能够选择文本。即使在不可编辑的普通 div 中也可以完成此操作。如果您想阻止所有用户访问,甚至包括选择各个字段的文本,那么您将不得不采取一些措施,例如在表单区域的顶部放置一个空白的透明 gif 图像。这将阻止所有鼠标与字段的交互,并与 readonly 和 tabIndex 相结合也应该阻止所有键盘访问。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

PreventDefault 不适用于焦点事件 的相关文章

随机推荐

  • “只读...”类型的参数不可分配给“...[]”类型的参数

    有一个类似的问题 但与我在这里发现的问题不同 类型的参数不可分配给 类型的参数 TS 2345 https stackoverflow com questions 54298051 argument of type is not assig
  • 如何在具有 Decimal 类型值的 pandas TimeSeries 上使用mean方法?

    我需要将 Python 十进制类型值存储在 pandas 中TimeSeries DataFrame目的 在 TimeSeries DataFrame 上使用 groupby 和 mean 时 Pandas 给我一个错误 以下基于浮动的代码
  • 将 ASP.NET MVC 混合到 ASP.NET WebForms 中

    由于某种原因 我的路由忽略了任何访问我的 MVC 页面的尝试 只是给了我 404 我有一个 WebForms 应用程序设置如下 虚拟目录 东西 所以我通常像这样访问我的网站 http localhost thing someFile asp
  • 为什么不总是使用 fpic(位置无关代码)? [复制]

    这个问题在这里已经有答案了 I read this https stackoverflow com questions 5311515 gcc fpic option在 PIC 上发帖 似乎使用 PIC 总是好的 无论何时它是 exe 静态
  • R 3.0.0 更新导致大量 2.x 软件包不兼容

    今天早上我在 Ubuntu 10 04 上更新了一些 R ubuntu 软件包 然后我尝试的第一个 R 脚本告诉我 Zoo 不是为 R 3 0 0 构建的 所以我这样做sudo R进而update packages ask F 假设它会使我
  • 如何使用 Jasmine 监视在另一个方法中创建的对象?

    给定以下代码片段 您将如何创建一个Jasmine http jasmine github io 2 0 introduction html spyOn测试以确认doSomething当你跑步时被呼叫MyFunction function M
  • Visual Studio Code 中的方法列表

    我最近开始使用 Visual Studio Code 编辑器 我真的很喜欢它 但是 对我来说 有一个关键功能我还没有找到 是否有一个方法列表 类似于 NetBeans 中的导航器或 Visual Studio 中的成员下拉列表 Yes th
  • 自定义 iPhone 返回键文本

    是否可以设置自定义返回键类型UITextField txtField setReturnKeyType UIReturnKeyDefault 我想用 SHARE 一词代替返回键类型 Thanks 没有 您可以获得操作系统中定义的返回键和键盘
  • Websocket 多通道与单通道 + 服务器端处理 [GroupChat]

    假设我们想要创建私人聊天室 用户可以在其中进行小组聊天 一个用户可以加入多个 x组 在每种情况下 我都需要在服务器上创建一个唯一的组并向用户订阅这些组 哪种方法是推荐的 性能更高的方法 1 在服务器端 我创建一个 Room 类并添加新房间c
  • 根据另一个关联数组的值构建关联数组

    我正在寻找一种优雅的方式来转动这个数组 Array foo gt 1 bar gt 1 zim gt 3 dib gt 6 gir gt 1 gaz gt 3 进入这个数组 Array 1 gt Array foo bar gir 3 gt
  • 移动跨平台开发的限制[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 目前 我计划将 Java 桌面应用程序移植到 Android 平台 除了官方安卓软件开发工具包 http developer andr
  • 使用 C# 和 JScript 汇总表

    我用 C 编写了代码来总结以下值InvoiceTable并将这些汇总值移至GroupTable在 Abbyy FlexiCapture 中 该软件比较新 运行时没有显示任何错误 需要写两套代码 在科技领域 在事件处理程序中 InvoiceT
  • vuetify中关闭芯片时如何停止选择打开?

    对于来自 vuetify com 的示例 使用芯片自动完成 当我取消芯片时 如何让它不打开选择菜单 i tried click stop 但它不起作用 芯片上事件 Thanks 我发现如果你删除box来自你的支撑v autocomplete
  • .NET Core 中带参数的自定义 JsonConverter

    我编写了自己的 JsonConverter 使用 ASP Net Core 3 1 打算在我的 DTO 上使用它 在以前的版本中 Newtonsoft Json 您可以在自定义 JsonConverter 类上添加构造函数 并使用 Json
  • EntityFramework 类在更新后被删除?

    我更改了数据库模型 以便其中一个表外键接受空值 之后我去了我的 edmx文件并执行 从数据库更新模型 保存后 代表表的所有类文件都被自动删除 如果我恢复数据库中的更改并重新保存我的 edmx 类将重新出现 但我真的希望这个外键能够接受空值
  • 为什么所有Powershell输出没有写入txt文件

    我在 Powershell Core 中运行以下 Powershell 脚本 PS C gt Get ChildItem Recurse File Filter pbix Sort Object Property LastAccessTim
  • 上传到 S3 时 Lambda 函数超时

    我有一个用 python 编写的 lambda 函数 它在 mongodb 中执行一些操作 然后它应该将函数的 tmp 文件夹中的图片上传到 s3 上 该函数在上传步骤中不断超时 我将超时设置为 2 分钟 并且该函数具有 S3 和 vpc
  • 更改 jQuery UI 按钮大小?

    我一直在我的页面上使用 jQuery UI 按钮 但是我还没有找到解决这个看似简单问题的方法 我希望我的一些按钮比其他按钮小 这应该像将按钮文本的 CSS 设置为类似的内容一样简单 font 8em 然而 jQuery UI 获取你的 DO
  • SQL Server 2005的默认并发控制

    SQL Server 2005 的默认并发控制是什么 是乐观并发控制还是悲观并发控制 这个可以设置吗 感谢期待 悲观 似乎是 2005 年的默认设置 尽管可以根据需要激活快照隔离 在默认的悲观模型中 第一个写入者将阻止所有后续写入 作家 但
  • PreventDefault 不适用于焦点事件

    我正在尝试设计一种表单 如果它具有特定的类 则用户应该无法与任何输入进行交互 由于各种原因 我想避免使用 disabled 属性 我试图阻止焦点事件的默认设置 但它不起作用 我在最新版本的 Firefox Chrome 和 Android