.click();事件在html5页面不生效

2024-10-21

jquery 动态生成html后click事件不触发原因

转自:http://www.iam3y.com/html/560.html 最近在做一个项目的时候,遇到动态加载微博内容,然后点击“展开评论”后获取该微博的所有评论.这里使用了动态加载的<span mid=’123456789′ class=’get_comment’>点击加载评论</span>. 然后再写 $(“.get_comment).click(function(){ //响应事件逻辑 }) ,发现click事件并不会触发,使用控制台侦听也木有错误.百思不得其解时,将焦点落

vue中，svg图标添加click事件，部分浏览器不生效

vue项目中,使用svg图标,但是发现,为svg图标绑定click事件时,部分浏览器会出现,点击没有反应的情况,代码如下: <icon name="icon_add" @click="addSubject(scope.$index)"> </icon> 后来发现,在edge内核中只有点击svg边缘部分才会触发click事件所以解决办法如下:为svg图标外面包裹一层元素,click事件绑定在外侧元素上 <a href='javascri

关于移动端click事件绑定的一个细节

click是最常见的点击事件,但是对于移动终端,比如手机,一般都是以touch事件代替的,而click事件在手机也是生效的,只是会有1-2秒左右的延迟,那么当你想要用click而非touch事件的时候,该如何处理事件绑定的呢,不用说,为了阻止事件冒泡,以及动态加载出来的DOM元素也绑定点击事件,肯定是这样使用的: $('body').on('click','#btn',function(){ alert(1); }) 好了,在pc浏览器模拟手机环境中测试没问题,在安卓手机中实测也是没问题,但是到

移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法

这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且touchend也经常不触发. 之后百度了一下这个问题,原因是主要是由于200ms超时导致内核不一定会一直处理touchmove事件,一旦超时会将后续所有的事件转交给UI处理,导致touchmove不会一直触发. 为了解决开发者需要,建议开发者在touchstart时调用event.preventDe

IOS设备上给body绑定click事件不生效及其解决办法

事件背景: 最近在做一个移动端业务的时候碰到一个bug,在ios上对body绑定click事实现事件代理冒泡至某些元素上尽然不生效. 思考: 暂借助jquery展示下事件绑定代码,将所有标签含有data-tip属性的元素通过事件代理至body $('body').on('click','[data-tip]',function(e){ console.log($(this.).attr('data-tip')) }) 这样做在android和pc上都可以正常实现,但是在ios上面对部分标签尽然不

在asp.net页面上按回车会触发Imagebutton控件的Click事件

原文:在asp.net页面上按回车会触发Imagebutton控件的Click事件问题: 用asp.net做的aspx页面,无论是否有文本框.下拉框.复选框……获得焦点,只要在当前页面上按一下回车就会触发该页面上的第一个Imagebutton控件的Click事件. 原因: 在form表单内部如果出现了input type="image"或者input type="submit"这些控件,都会自动接收表单上的回车事件方案: 在页面上放2个imagebutton,第

如何通过js在子页面调用父页面元素的click事件

//获取父页面的某个元素var node = window.parent.document.getElementById("btnReturn");//调用该元素的Click事件 node.click();

处理移动端click事件300ms延迟的好方法—FastClick

下载地址:https://github.com/ftlabs/fastclick 1.click事件为什么有延迟? “...mobile browsers will wait approximately 300ms from the time that you tap the button to fire the click event. The reason for this is that the browser is waiting to see if you are actually p

click事件的累加绑定，绑定一次点击事件，执行多次

最近做项目为一个添加按钮绑定点击事件,很简单的一个事情,于是我按照通常做法找到元素,使用jquery的on()方法为元素绑定了点击事件,点击同时发送请求.完成后看效果,第一次点击没有问题.再一次点击后发现发送了两次请求,后面再点击发现请求的数量越来越多.这时我初步判断可能是元素有多个或是多次调用了方法,但找了一遍,发现只为一个元素绑定了事件,且只调用了一次.后来通过查资料才知道是点击事件被累加绑定了!那到底什么是累加绑定呢?什么时候会发生累加绑定?累加绑定后该如何解决呢?下面我就通过这三个问题来

关于a标签自身的click事件所带来的一些影响

众所周知a标签自身带有点击事件<a href="#"></a>从它本身的特性来讲并没有什么不好的影响,但是如果你在a标签里又加入onclick事件则<a href="#" onclick=""></a>会产生意想不到的后果如, 本人在一个项目中由于没将a标签自身的点击事件阻断而造成跨域问题也就是在控制台的Network里面的Status的状态为canceled 这是我第一次遇到这种状态,于是上网上

关于IOS浏览器：document,body的click事件触发规则

今天做了个手机页面,点击某个按钮->弹出菜单,再点击菜单以外的任意位置->关闭菜单,在其他浏览器里面没有问题,但是在IOS浏览器中并不会关闭. 网上解决这个bug的帖子很多,这篇帖子主要是讲原理,这里写个简单的代码,大家可以复制到自己页面中去实验: <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=devi

fastclick与zepto的 tap事件关于在手机上click事件的300ms延迟的区别

之前翻译过一篇关于fastclick的快速点击文章http://www.cnblogs.com/lilyimage/p/3568773.html,fastclick可以解决在手机上点击事件的300ms延迟:另外我们也知道zepto的touch模块,帮助我们实现了很多手机上的事件,比如tap等,tap事件也是为了解决在click的延迟问题.那么他们有什么区别呢? 先看zepto的touch模块实现: $(document) .on('touchstart ...',function(e){ ...

a标签的herf和click事件

在动态网页中,常常需要在单击超链接时处理一些数据,而不是跳转一个网页.在这种情况下,通常有以下三种处理方式: 不设置<a>标签的href属性,只设置onclick属性.在这种处理方式下,通常超链接文本会和正文的文本以相同的形式出现,即不会有默认的下划线.当鼠标放在超链接上也不会显示小手的形状(除非为该超链接设置了CSS).因此,用户很难知道这是一个可以点击的超链接. 将<a>标签的href属性值设置为"#",并设置onclick属性.在这种处理方式下,用户可以

从click事件理解DOM事件流

事件流是用来解释页面上的不同元素接受一个事件的顺序,首先要明确两点: 1.一个事件的影响元素可能不止一个(同心圆理论),但目标元素只有一个. 2.如果这些元素都绑定了相同名称的事件函数,我们怎么知道这些函数的运行顺序?于是有了事件流的概念(事件捕捉,事件冒泡) 举个例子: <div id="outer"> <p id="inner">Click me!</p> </div>为了看起来方便,先无视CSS样式,那么蓝色的区

移动端click事件延迟300ms的原因以及解决办法

这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点的问题.这当中最出名的,当属双击缩放(double tap to zoom).这也是会有上述 300 毫秒延迟的主要原因. 当用户一次点击屏幕之后,浏览器并不能立刻判断用户是要进行双击缩放,还是想要进行单击操作.因此,iOS Safari 就等待 300 毫秒,以判断用户是否再次点击了屏幕. 于是,

隔离click事件

有一些应用,不需要我们自己的定义的click函数,例如: $(document).on('click', '#inp', function(e){ alert('hello world!'); }); 希望点击id="inp"时,不予以响应,那怎么办!!看代码: document.addEventListener('click',touch, true); function touch (event){ switch(event.type){ case "click"

分享一个移动项目中消除click事件点击延迟的方法

对于前端工程师来说,apicloud无疑给我们提供了很好的平台,有各种各样的模块供我们使用,但是在实际项目的时候,很大部分的代码,还是需要我们用html css js来实现的.但是呢,移动端页面对于click事件会有 300 毫秒的延迟,导致多数用户感觉移动设备上基于 HTML 的 web 应用界面响应速度慢. 在这里推荐一个简单易用的 js库,用来消除界面中的click事件造成的延迟. https://github.com/ftlabs/fastclick 目前,亲测在iphone表现很完美.

jquery添加的html元素按钮为什么不执行类样式绑定的click事件

代码举例: 更多按钮: <input type="button" class="addMore" id="addMore${issue.id }" value="更多" /> 点击按钮添加一行文本框和“提交”按钮:(没有问题,可以正常添加) $(".addMore").click(function(){ var index = this.id.substring(7,this.id.length

a标签的click事件问题

easy知识点, a标签的click事件和href共存会在执行click事件后触发href里面的链接,如果把href设为空字符串:href="",则会使用当前页面的url作为跳转链接. 解决方法很简单: 1. 删除A标签的href属性.但是这样会出现一个问题,在点击A标签的时候,页面的焦点会定位到页面的top处. 2. href="javascript: void(0);". 3. click事件使用return false;即可.

ios 设备用jquery live绑定 click 事件不管用

问题描述:用js拼接的html追加到页面,然后用 live 绑定click事件不起作用解决办法:1.直接在标签写onclick事件 2.给需要绑定的标签添加css样式{cursor:pointer},让他认为你是一个可以点击的标签,这样就可以了原文:http://blog.sina.com.cn/s/blog_6c969b4a0102wfkq.html

手机浏览器下IScroll中click事件

产品的h5页面几乎都使用了iscroll插件,如果a标签在iscroll里,在部分手机浏览器中会出现无法点击的情况,不管是绑定click事件还是使用a标签的href属性.href属性偶尔还会能点击,click事件完全不能. 如果用button或input代替a,都能响应click事件. 如果用微信内置浏览器,都能响应click事件(nubia除外).QQ浏览器也能响应. 也就是出现此问题跟手机本地浏览器,iscroll,a标签都有关系. iScroll uses various techniqu

.click();事件在html5页面不生效

热门专题