hover和点击事件之间的冲突

 笔记慢慢的才发现已经写了好多,今天刷网页才想起来是不是应该发到自己Blog里面跟大家分享一下虽然不是什么大牛,但还是有一些小小的心得~希望和大家分享,见笑了!

我们有个li 现在需要一个点击发生改变和另一个仍然可以进行hover

商品点击后会变色,然后商家依然可以进行hover。

不可取的方法为:

(1)  JQ添加点击事件改变其css( ) 这种方法不可用,因为通过javascript修改background-color会覆盖在css中定义的所有background-color属性,当然也包含hover下的background-color属性,所以这样写当进行一次点击事件后,hover事件就会失效。

(2)  如果JQ使用addClass( )方法,会牵扯到优先级问题。

(3)  在js里面用JQ的hover( ),这样仍然是不可以的。

可取方法为:

(1)  可预先写好两个CSS样式表,和一个hover样式

然后JS写,这次我们用JQ里面的attr( )直接让两个li的类名改变,这两就不会牵扯到其他一系列的问题了。

时间: 2024-10-13 10:38:30

hover和点击事件之间的冲突的相关文章

gridview中单元格button的点击事件和onitemclick点击冲突及解决办法

如果是listview的onitemclick的点击事件与子button的点击事件冲突,很多人都知道通过对listview设置android:descendantFocusability="blocksDescendants",以及对button设置android:focus="false",来屏蔽button的焦点以及点击事件从而解决冲突.然而不幸的是,本人今天对类似的gridview设置此项属性,亲测并没有什么用. 解决办法是有的,例如把button改为text

ios UITapGestureRecognizer 单指单击、单指多击、多指单击、多指多击事件操作

转自:http://blog.csdn.net/longzs/article/details/7457108 在ios开发中,需用到对于手指的不同操作,以手指点击为例:分为单指单击.单指多击.多指单击.多指多击.对于这些事件进行不同的操作处理,由于使用系统自带的方法通过判断touches不太容易处理,而且会有事件之间的冲突. 接下来,通过以UITapGestureRecognizer 手势实现此功能需求 代码如下: ViewController.m中的viewDidLoad方法: 1: //单指

fastclick.js --- 解决移动端点击事件300ms延时

Fast Click 是一个简单.易用的库,专为消除移动端浏览器从物理触摸到触发点击事件之间的300ms延时. 为什么会存在延迟呢? 从你触摸按钮到触发点击事件,移动端浏览器会等待接近300ms,原因是浏览器会等待以确定你是否执行双击事件 兼容性 Mobile Safari on iOS 3 and upwards Chrome on iOS 5 and upwards Chrome on Android (ICS) Opera Mobile 11.5 and upwards Android B

从Listview与Button点击事件冲突看安卓点击事件分发机制

题目有点长.其实实现Listview的时候大家都可能会碰到这样的一个问题,那就是Listview的OnItemClickListener点击事件与Button(或者checkbox)的touch(或者click)事件冲突的问题. 声明一下,非常感谢郭大师的这篇blog: http://blog.csdn.net/guolin_blog/article/details/9097463 原理参考了这篇blog,事实上也是本人功力不够不能阅读源码的缺陷啊. 下面说下自己的解决步骤: 1)首先先set一

解决ListView中Item的子控件与Item点击事件冲突

经常会碰到在ListView中点击其中一个Item,会一并触发其子控件的点击事件,例如Item中的Button.ImageButton等,导致了点击Item中Button以外区域也会触发Button点击事件.在网上找了相关方法,这里记录下,亲测可行.. 1.在Item的xml文件根元素中添加属性:android:descendantFocusability="blocksDescendants" 2.在冲突的子控件中添加属性:android:focusable="false&

GridView的点击事件冲突解决

在开发的时候,经常可能遇到ListView或GridView控件点击事件与Item点击事件冲突的问题.原因是Item布局中的button或ImageButton强制获取了item的焦点,解决方式之一是:只要设置Item布局中的button的focusable为false即可,另外可以在Item布局的根节点添加属性android:descendantFocusability="blocksDescendants"也可以解决. 今天在开发一界面的时候遇到了点击事件冲突问题,并不是I控件本身

vue中解决拖动和点击事件的冲突

BUG说明: 鼠标上下方向拖拽,如果松开时鼠标位于悬浮按钮上会默认执行click事件,经验证,click事件与mouse事件的执行顺序为onmousedown =>onmouseup =>onclick,意味着在click事件执行时会与与其相关的mouse事件冲突. 解决方案:因为click事件执行时间短,所以利用鼠标拖动的时间差作为标志,在拖拽事件中计算鼠标从onmousedown 到onmouseup 所用的时间差,与200ms作比较,作为全局变量.由于vue的directives自定义指

vue中的长按事件和点击事件冲突

<div> <img src="/static/images/poi-marker-default.png" @touchstart.prevent="touchin()" @touchend.prevent="clickhandle()" > </div> data() { return { Loop:0 } }, methods: { touchin(index){ // 长按事件,按住后等待指定事件触发

Android学习之解决ListView中item点击事件和item中Button点击事件冲突问题

在ListView中添加Button后,如果只是单纯的加入而不加限制的话,ListView的onClick点击事件没有响应,因为Button获取了item的焦点,想要两者都可点击,需要加上如下限制: 在ListView的适配器中的布局文件中添加: (1)在布局文件的根元素上中添加属性android:descendantFocusability="blocksDescendants" (2)在Button中添加属性android:focusable="false"和a