jquery 第一次点击时禁用链接并充当：hover

zpqajqem 于 2023-10-17 发布在 jQuery

关注(0)|答案(2)|浏览(105)

我想禁用一个链接，其中包含一个菜单，当用户通过平板电脑设备访问网站，所以，当用户从平板电脑点击链接：
->出现按钮，但链接被禁用，然后在第二次点击链接工作。
我认为这可能已经解决了，但我还没有找到合适的东西，我正在使用来自here的代码

jQuery(document).ready(function ($) {

    $("li.taphover > a").on('touchstart', function (e) {
        'use strict'; //satisfy the code inspectors
        var link = $(this); //preselect the link
        if (link.hasClass('hover')) {
            return true;
        } else {
            link.addClass('hover');
            $('li.taphover > a').not(this).removeClass('hover');
            e.preventDefault();
            return false; //extra, and to make sure the function has consistent return points
        }
    });

});

但它使链接失效了，什么都不管用。

jquery

来源：https://stackoverflow.com/questions/34830403/disable-link-on-first-click-and-act-as-ahover

2条答案

按热度按时间

kgqe7b3p1#

我发现了一个简单的Jquery插件here的作品。该链接还有一个教程，介绍如何创建一个响应式菜单，在第一次点击时禁用顶部的链接（li：has（ul））。

赞(0）回复(0）举报 2023-10-17

vs3odd8k2#

有一种方法可以只使用CSS。
您必须创建一个包含带链接的锚的元素，其中这将在容器DIV的:hover和:focus上调整大小。
看看并尝试下面的代码：

.box {
  position: relative;
  width: 160px;
  height: 200px;
  border: 1px solid black;
  background-color: #eee;
}
.box p {
  padding: 2em;
  text-align: center;
  font-size: 1.4rem;
}
.box .link-over {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 0;
  z-index: 1;
  background-color: rgba(200, 200, 255, 0.3);
  transition: height 0ms linear 100ms;
}
.box:hover .link-over,
.box:focus .link-over {
  height: 100%;
}

<div class="box">
  <p>My content</p>
  <a class="link-over" href="#" onclick="alert('click')"></a>
</div>

赞(0）回复(0）举报 2023-10-17

我来回答

jquery 第一次点击时禁用链接并充当：hover

2条答案

相关问题

热门标签

最新问答