javascript - 双击打开链接

Question

如何制作超链接<a>Link</a>双击链接:i:e 链接应该在双击时打开，单击应该什么都不做。

Answer 1

好的，那么，您可以这样做:

HTML:

<a id='golink' href='gosomewhere.html'>Go Somewhere</a>

使用 jQuery 的 JavaScript:

jQuery(function($) {
    $('#golink').click(function() {
        return false;
    }).dblclick(function() {
        window.location = this.href;
        return false;
    });
});

实时复制:

jQuery(function($) {
    $('#golink').click(function() {
        return false;
    }).dblclick(function() {
        window.location = this.href;
        return false;
    });
});

<a id='golink' href='http://stackoverflow.com' target="_blank">Go Somewhere</a>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

(它不一定是 ID；您可以使用类或其他任何可以让您形成 jQuery 可以处理以连接事物的选择器的东西来做到这一点。)

如果用户禁用了 JavaScript，链接将正常工作。爬虫程序会正常找到链接等。如果用户启用了 JavaScript，事件处理程序将被连接起来，并且需要双击。

不过，上面的内容破坏了键盘导航，所以你必须处理它:

jQuery(function($) {
    $('#golink').click(function() {
        return false;
    }).dblclick(function() {
        window.location = this.href;
        return false;
    }).keydown(function(event) {
        switch (event.which) {
            case 13: // Enter
            case 32: // Space
                window.location = this.href;
                return false;
        }
    });
});

实时复制:

jQuery(function($) {
    $('#golink').click(function() {
        return false;
    }).dblclick(function() {
        window.location = this.href;
        return false;
    }).keydown(function(event) {
        switch (event.which) {
            case 13: // Enter
            case 32: // Space
                window.location = this.href;
                return false;
        }
    });
});

<a id='golink' href='http://stackoverflow.com' target="_blank">Go Somewhere</a>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

我无法想象这对可访问性有好处，而且我敢打赌上面没有满足其他方面的要求。全部输入:

但如果没有非常好的用例，我强烈建议不要这样做。