点击事件不生效,点击不起作用,多半是元素被遮挡。css元素被遮挡,选择不到

来源:互联网 发布:淘宝十元商品有哪些 编辑:程序博客网 时间:2024/06/05 20:42

有过js控制点击不生效的时候吗,这时就要考虑你的元素是否被其他元素遮挡了。这里说的遮挡并不是看不到。而是能看到,却无法透过另一元素选中它。
可以试一下以下两种方案:
1、css调节z-index
首先要考虑的是更外层的元素遮挡了靠里层的元素。比如外层遮挡为一个div(.card)被遮挡的是一个input框为(.input-space)
这时就要把遮挡它的元素的css中的z-index调的比他要低,假设:外层遮挡的类名为:card,被遮挡的input的类名为:input-space。

.card{    z-index:1;}.input-space{    z-index:2;}

2、写完之后看input框能不能选到(点击事件生不生效)。如果还是选不到(点击事件不生效),就在这个基础上为card再加一层css, pointer-events:none,此css以为鼠标事件对当前元素无效。

.card{    pointer-events: none;}

这样一来点击事件会直接略过卡片,所以就能直接选择到输入框了。
博客为原创,转载请附加此博客地址

阅读全文
0 0
原创粉丝点击