微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程
游戏教程 自媒体 新闻
首页 > web前端 > js教程 > 正文

jQuery delegate事件监听无效的解决办法

黄舟
发布： 2017-06-26 10:09:29
原创
2311人浏览过

在做微信的开发中，发现jquery的delegate绑定的事件监听无响应的解决办法。

前端的小朋友将原来 以下结构的代码

<a href="ssss">
<p>sssss</p>
<p>dddddd</p>
</a>
登录后复制

改成了

<div data-href="ssss">
<p>ssssss</p>
<p>dddddd</p>
</div>
登录后复制

因为涉及到一些异步加载的内容，所以使用如下代码来实现 a 标签的功能

$(document).delegate('[data-href]', 'click', function () {            
if ($(this).data('href')) {
                location.href = $(this).data('href');
            }
        });
登录后复制

轻舟办公
轻舟办公

基于AI的智能办公平台

轻舟办公 194
查看详情 轻舟办公

在PC浏览器上没有出现任何问题，当由iPhone 6 自带的浏览器打开的时候却直接失效了。

最终在stackoverflow上找到了解决方案，现记录如下：

On iOS there is no event bubbling without a cursor style. So in your CSS you need to add cursor: pointer; to the element.
登录后复制

添加CSS内容

*[data-href]{cursor: pointer;
}
登录后复制

以上就是jQuery delegate事件监听无效的解决办法的详细内容，更多请关注php中文网其它相关文章！

相关标签：
jquery

大家都在看：

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。

下载
来源：php中文网
收藏 点赞
上一篇：JQuery事件委托机制之delegate和undelegate的实例分析 下一篇：jQuery中delegate方法如何实现Ajax请求绑定事件不丢失详解
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
js单例模式如何理解 单例模式的核心是确保一个类或对象在整个应用中只有一个实例并提供全局访问点。它主要用于解决多个地方需要共享同一状态或资源的问题，如配置管理、日志记录、数据库连接等。JavaScript中常见的实现方式包括：1.对象字面量——天然单例；2.闭包+构造函数——通过判断实例是否存在来控制唯一性；3.ES6模块——默认导出的对象在多次导入时仍为同一实例。尽管单例便于状态共享，但也存在耦合度高、难以测试、隐藏依赖等问题，因此建议优先使用依赖注入而非硬编码单例。理解“唯一实例”和“状态共享”的设计初衷比套用模
2025-11-06 07:59:27
199
使用JavaScript实现一个简单的自动完成组件_javascript UI组件 自动完成组件通过监听输入事件过滤数据并显示匹配建议。首先创建输入框和隐藏的下拉列表，使用CSS定位与样式控制外观；JavaScript定义数据源，实时匹配用户输入并动态渲染建议项，支持点击选中和外部点击关闭。可扩展异步加载、键盘导航、高亮匹配及防抖优化。
2025-11-06 06:15:22
615
JavaScript 拖放 API：实现元素的拖放交互功能 要实现拖放功能需设置draggable="true"，并通过dragstart、dragover、drop等事件配合dataTransfer传递数据，其中dragover必须调用preventDefault才能触发drop。
2025-11-06 04:33:24
867
JavaScript与SpringBoot命令行Runner结合的方法 SpringBoot可通过调用Node.js执行JavaScript。1.使用ProcessBuilder运行外部JS文件，适合复杂逻辑；2.Java8-14可用Nashorn引擎执行简单脚本，但不支持npm模块；3.推荐将JS逻辑封装为独立微服务，SpringBoot启动时通过WebClient调用API通信，实现前后端分离与解耦。
2025-11-06 03:43:15
218
js状态模式是什么 状态模式通过封装对象状态及其行为，使对象在内部状态改变时改变其行为，避免复杂条件判断。上下文（如Light）持有当前状态，并将状态相关操作委托给具体状态对象处理；具体状态（如OnState、OffState）实现各自行为逻辑并可切换状态。示例中灯的开关通过press方法触发不同行为，无需if/else判断。优点包括消除条件逻辑、提升扩展性与职责清晰，适用于多状态场景如订单流程、按钮状态、游戏角色动作等，增强代码可维护性与灵活性。
2025-11-06 01:09:27
656
js外观模式的介绍 外观模式是通过创建高层接口简化复杂系统调用的设计模式。它封装多个子系统操作，如将事件绑定、数据加载和DOM渲染整合为一个初始化方法，使客户端无需了解内部细节，仅通过统一接口（如pageInitFacade.init()）即可完成调用，从而降低使用复杂度、实现解耦并提升可维护性，常用于浏览器兼容处理、多API组合调用等场景。
2025-11-06 00:33:10
438
JavaScript如何使用模板字符串_JavaScript模板字符串语法与嵌入变量方法 模板字符串使用反引号定义，支持多行文本和嵌入变量，通过${}插入变量或表达式，可提升代码可读性与编写效率。
2025-11-06 00:25:36
258
使用Geolocation API获取用户地理位置_javascript技巧 GeolocationAPI可用于获取用户位置，适用于天气、地图等场景；使用时需用户授权且页面运行在HTTPS环境下；通过getCurrentPosition()获取一次位置，watchPosition()持续追踪，并可调用clearWatch()停止监听；需处理权限拒绝、定位不可用、超时等错误情况。
2025-11-05 23:55:02
788
JavaScript 自定义事件：创建与分发自定义 DOM 事件 自定义事件通过CustomEvent创建，配合dispatchEvent分发和addEventListener监听，实现组件间解耦通信。1.使用newCustomEvent(‘name’,{bubbles,cancelable,detail})定义事件；2.调用element.dispatchEvent(event)触发；3.用addEventListener(‘name’,handler)接收，可跨组件传递数据，适用于表单验证等场景。
2025-11-05 23:54:02
787
现代JavaScript模块化开发实践与演进 JavaScript模块化从早期全局污染问题演进到ESModules标准，历经IIFE、CommonJS、AMD等方案，最终通过import/export实现静态分析、循环引用处理及跨平台支持，结合Webpack、Vite等工具优化开发流程，成为现代前端工程化核心基础。
2025-11-05 23:53:02
543
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部