首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

document addEventListener touchstart在Safari控制台中没有任何响应

addEventListener是JavaScript中的一个方法,用于向指定的元素添加事件监听器。touchstart是移动设备上的一个触摸事件,当用户触摸屏幕时触发。在Safari控制台中没有任何响应可能是由于以下几个原因:

  1. 代码错误:请确保代码中正确使用了addEventListener方法,并且传入了正确的参数。例如,确保指定了正确的元素和事件类型。
  2. 兼容性问题:某些浏览器可能不支持某些事件类型或方法。在Safari中,touchstart事件应该是被支持的,但可能存在版本差异或其他问题。可以尝试在其他浏览器中测试同样的代码,以确定是否是Safari的问题。
  3. 元素不存在:如果指定的元素在页面中不存在,那么添加事件监听器自然不会有任何响应。请确保元素存在于DOM中,并且可以通过选择器或其他方式正确获取到。
  4. 其他原因:可能存在其他原因导致Safari控制台中没有任何响应,例如浏览器设置、插件冲突等。可以尝试在其他设备或浏览器中进行测试,或者查看浏览器的错误日志以获取更多信息。

关于Safari控制台中没有任何响应的具体解决方法,可以参考Safari开发者文档或搜索相关的技术论坛和社区。腾讯云相关产品和产品介绍链接地址与此问题无关,不需要提供。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

javaScript — touch事件详解(touchstart、touchmove和touchend)

一开始触摸事件touchstart、touchmove和touchend是iOS版Safari浏览器为了向开发人员传达一些信息新添加的事件。...因为ios设备既没有鼠标也没有键盘,所以在为移动Safari浏览器开发交互性网页的时候,PC端的鼠标和键盘事件是不够用的。...iPhone 3Gs发布的时候,其自带的移动Safari浏览器就提供了一些与触摸(touch)操作相关的新事件。随后,Android上的浏览器也实现了相同的事件。...关于这个事件的确切出发时间,文档中并没有具体说明,咱们只能去猜测了。 上面的这些事件都会冒泡,也都可以取消。虽然这些触摸事件没有DOM规范中定义,但是它们却是以兼容DOM的方式实现的。...function load (){ document.addEventListener('touchstart',touch, false); document.addEventListener

1.7K20

让 touch 系列事件触发的滚动响应更快

我们相信,开发者们没有必要去完全参透浏览器(各种)复杂的细节,网站本来就是应该是快速地。因而在 Chrome 56中,我们将touch系列事件的监听器默认设为“被动”,大多数情况下这正是前端所需要的。...2背景 如果你touchstart或touchmove事件处理函数中调用preventDefault(),这将会阻止(页面)滚动。...因而我们做出以下优化:只要 touchstart 或者 touchmove 事件的事件监听器是注册window, document或body上的时候,我们会将passive默认为true,也就是说代码是这样的...未来,我们希望默认为所有touchstart和touchmove的事件监听器的passive设置为true,并优化到(滚动响应)低于50ms。...虽然仍需要为移动端的 Safari 调用preventDefault(),然而 Chrome 已经不再推荐网站依靠在touchstart 和 touchmove 事件处理函数中调用preventDefault

91820

Unable to preventDefault inside passive event listener

Making touch scrolling fast by default 简而言之: 由于浏览器必须要在执行事件处理函数之后,才能知道有没有掉用过 preventDefault() ,这就导致了浏览器不能及时响应滚动...所以为了让页面滚动的效果如丝般顺滑,从 chrome56 开始, window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数,会默认为是 passive...chrome56 中,照样滚动,而且控制台会有提示,blablabla window.addEventListener('touchmove', e => e.preventDefault()) 那么如何解决这个问题呢...不让控制台提示,而且 preventDefault() 有效果呢?...CSS 属性 touch-action: none; 这样任何触摸事件都不会产生默认行为,但是 touch 事件照样触发。

1.3K20

【总结】1823- 移动端滚动穿透与滚动溢出解决方案

大意是说, touchstart 和 touchmove 事件中调用 preventDefault 方法可以阻止任何关联事件的默认行为,包括鼠标事件和滚动。 因此我们可以这样处理。...const popup = document.querySelector('.popup') const scrollBox = document.querySelector('.content')...❌ 解决方案A (overscroll-behavior) overscroll-behavior 是 CSS 的一个特性,允许控制浏览器滚动到边界的表现,它有如下几个值。...所以可以这样解决问题: .content { overscroll-behavior: none; } 简洁干净高性能,不过 Safari 全系不支持,兼容性如下,有没有感觉 Safari 就是现代版的...let initialPageY = 0 scrollBox.addEventListener('touchstart', (e) => { initialPageY = e.changedTouches

46211

10 种 JavaScript 最常见的错误

您可以很容易的 Chrome 开发者控制台中进行测试。 ? 发生这种情况的原因很多,但常见的一种是渲染 UI 组件时对于状态的初始化操作不当。...您可以 IE 开发者控制台中进行测试。 ? 这相当于 Chrome 中的 “TypeError:”undefined“isnotafunction” 错误。...您可以 Chrome 开发人员控制台和 Mozilla Firefox 开发人员控制台中进行测试。 ?...您可以 Chrome 开发者控制台中进行测试。 ? 此外,如果您将值传递给超出范围的函数,也可能会发生这种情况。 许多函数只接受其输入值的特定范围的数字。...您可以 Chrome 开发者控制台中进行测试。 ? 您通常会在数组中找到定义的长度,但是如果数组未初始化或者变量另一个上下文中,则可能会遇到此错误。让我们用下面的例子来理解这个错误。

8.5K20

吃透移动端 H5 与 Hybrid|实践踩坑12种问题汇总

整体表现就是滑动不流畅,没有滑动惯性。 产生原因 为什么 iOS 的 webview 中 滑动不流畅,它是如何定义的? 最终我 safari 文档里面寻找到了答案(文档链接在参考资料项)。 ?...实现如下: document.body.addEventListener('touchmove', function(e) { if(e....iOS 中的 safari,为了实现双击缩放操作,单击 300ms 之后,如果未进行第二次点击,则执行 click 单击操作。也就是说来判断用户行为是否为双击产生的。...原生中使用 el.addEventListener("touchstart", () => { console.log("ok"); }, false); vue 中使用 <button @touchstart... PC 端开发时,我们可以直接掉出控制台,使用浏览器提供的工具操作devtools或者查看日志。但是 App 内部我们怎么做呢?

2.1K20

Unable to preventDefault inside passive event listener due to target being treated as passive 怎么办?

历史:当浏览器首先对默认的事件进行响应的时候,要检查一下是否进行了默认事件的取消。这样就在响应滑动操作之前有那么一丝丝的耽误时间。...但是浏览器的控制台就会进行错误提醒了。...具体情况: 从 chrome56 开始, window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数,会默认为是 passive: true。...chrome56 中,照样滚动,而且控制台会有提示,blablabla window.addEventListener('touchmove', e => e.preventDefault()) 那么我们这些小程序员该怎么办呢...CSS 属性 touch-action: none; 这样任何触摸事件都不会产生默认行为,但是 touch 事件照样触发。

73110

【Hybrid】518- 12种移动端 H5 与 Hybrid问题汇总

整体表现就是滑动不流畅,没有滑动惯性。 产生原因 为什么 iOS 的 webview 中 滑动不流畅,它是如何定义的? 最终我 safari 文档里面寻找到了答案(文档链接在参考资料项)。 ?...实现如下: document.body.addEventListener('touchmove', function(e) { if(e....iOS 中的 safari,为了实现双击缩放操作,单击 300ms 之后,如果未进行第二次点击,则执行 click 单击操作。也就是说来判断用户行为是否为双击产生的。...原生中使用 el.addEventListener("touchstart", () => { console.log("ok"); }, false); vue 中使用 <button @touchstart... PC 端开发时,我们可以直接掉出控制台,使用浏览器提供的工具操作devtools或者查看日志。但是 App 内部我们怎么做呢?

1.3K22

移动端H5页面开发坑点指南

触碰触发播放并暂停(让音频开始加载),后面用JS再操作就没问题了;解决代码: document.addEventListener('touchstart', function () { document.getElementsByTagName...元素的autoplay属性IOS及Android上无法使用,PC端正常 2.audio元素没有设置controls时,IOS及Android会占据空间大小,而在PC端Chrome是不会占据任何空间...问题4:Safari浏览器自动播放 document.addEventListener('touchstart', function(){ audio.play(); }, false)...)标签绑定点击事件无效 iOS(safari)有时候某个标签绑定点击事件无效,加上空的onclick=""就好了,如: ios中location.href跳转页面空白 location.href外套一层...window resize,导致实际页面dom仍然被键盘顶上去--错位 document.addEventListener('focusout', () => { document.body.scrollTop

3K10

【兼容性】H5滚动穿透解决方案

如果 element 无法滚动,那么就让 document 响应滚动 是一个 if-else 的关系 这个element 无法滚动包括 没有设置可滚动overflow属性 监听回调 设置了 preventDefault...7就使用过这种方式 5禁用页面滚动 除了 css 限制页面滚动,还可以从 js 去限制 document.addEventListener( 'touchmove', e => e.preventDefault...(type, listener[, useCapture]); 第三个参数是 控制监听器是 捕获阶段还是 冒泡阶段执行,默认值是 false(冒泡阶段执行) 现在变成了 target.addEventListener...,当滚动的元素白名单之内,我们就放开限制 这个白名单的设置就是 给元素加上 can-scroll 类名,这样就可以放开滚动 document.addEventListener( "touchmove...和 document 从这里可以意识到,单次的滚动行为 只会绑定一个滚动对象,不会切换响应对象 只是开始滚动的时候,浏览器会根据情况,选择响应滚动的对象,选择时候不会切换

5.5K20

移动端点击事件延迟的诞生消亡史

因此,IOS Safari 浏览器首先引入了 300 毫秒延迟,用来判断用户是否会再次点击,也就是说,第一次点击延迟 300 毫秒,300 毫秒后用户没有再次点击则认定为用户进行普通的单击操作,并触发单击...消亡史 虽然从当时来看 300ms 延迟并没有什么不妥,然而在越来越注重用户体验的移动互联网时代,这种延迟是无法被用户所接受的,加之开发者也可以对网站进行响应式适配,双击缩放的操作变成了一种可有可无的操作...FastClick 的原理 touchend 阶段调用 event.preventDefault,然后通过 document.createEvent 创建一个自定义事件 MouseEvents,然后通过...关于 FastClick 的好处是,它非常容易使用,只需文档加载后调用 FastClick.attach() body 元素上实例化: if ('addEventListener' in document...) { document.addEventListener('DOMContentLoaded', function() { FastClick.attach(document.body); }

2.8K20

12个关于移动 H5 开发的采坑问题汇总

整体表现就是滑动不流畅,没有滑动惯性。 产生原因 为什么 iOS 的 webview 中 滑动不流畅,它是如何定义的? 最终我 safari 文档里面寻找到了答案(文档链接在参考资料项)。...实现如下: document.body.addEventListener('touchmove', function(e) { if(e....iOS 中的 safari,为了实现双击缩放操作,单击 300ms 之后,如果未进行第二次点击,则执行 click 单击操作。也就是说来判断用户行为是否为双击产生的。...原生中使用 el.addEventListener("touchstart", () => { console.log("ok"); }, false); 复制代码 vue 中使用 <button... PC 端开发时,我们可以直接掉出控制台,使用浏览器提供的工具操作devtools或者查看日志。但是 App 内部我们怎么做呢?

1.5K20

吃透移动端 H5 与 Hybrid|实践踩坑12种问题汇总

整体表现就是滑动不流畅,没有滑动惯性。 产生原因 为什么 iOS 的 webview 中 滑动不流畅,它是如何定义的? 最终我 safari 文档里面寻找到了答案(文档链接在参考资料项)。...实现如下: document.body.addEventListener('touchmove', function(e) { if(e....iOS 中的 safari,为了实现双击缩放操作,单击 300ms 之后,如果未进行第二次点击,则执行 click 单击操作。也就是说来判断用户行为是否为双击产生的。...原生中使用 el.addEventListener("touchstart", () => { console.log("ok"); }, false); vue 中使用 <button @touchstart... PC 端开发时,我们可以直接掉出控制台,使用浏览器提供的工具操作devtools或者查看日志。但是 App 内部我们怎么做呢?

1.2K30
领券