代码之家  ›  专栏  ›  技术社区  ›  MalphasWats

仅在双击时激活链接

  •  1
  • MalphasWats  · 技术社区  · 15 年前

    我正在为我的网站构建一个非常简单的基于Web的文件浏览器。

    我已经将链接设置为类似于文件的样式,我希望能够单击选择它们,这样我就可以执行重命名等操作,并且我希望能够双击以实际激活链接并下载文件。

    我想出了以下几点,但看起来很难看。有人有更优雅的解决方案吗?

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Untitled Document</title>
    
    <script type="text/javascript">
    
    function nullClick()
    {
        //do select stuff
        return false;
    }
    
    function dolink(link)
    {
        window.location(link.href);
    }
    
    </script>
    
    </head>
    
    <body>
    
    <a href="http://pathtofile" onclick="return nullClick();" ondblclick="dolink(this);">Clicky</a>
    
    </body>
    </html>
    
    5 回复  |  直到 15 年前
        1
  •  4
  •   Ben S    15 年前

    我会避免这样做,因为这违背了用户对网站功能的期望,但如果必须这样做,那么你这样做的方式是我所知道的唯一方式。

    此外,您应该知道,如果禁用或不可用javascript,站点将返回到可单击的单个链接。

        2
  •  2
  •   Tarik    15 年前
    <a href="http://pathtofile" onclick="return false" ondblclick="window.location = 'some where'">Clicky</a>
    

    我认为这将是一个更优雅的解决方案,只需要一行代码。

        3
  •  1
  •   Joel Martinez    15 年前

    如果你不反对一点 jQuery 以下内容:

    $("#yourLinkId").dblclick(function () { 
          window.location($(this).attr("href")); 
        });
    
        4
  •  1
  •   BalusC    15 年前

    如何使用 jQuery ?

    HTML示例:

    <a href="javascript:alert('link1')" class="dblclick">link1</a><br>
    <a href="javascript:alert('link2')" class="dblclick">link2</a><br>
    <a href="javascript:alert('link3')" class="dblclick">link3</a><br>
    

    jQuery示例:

    $('a.dblclick')
        .bind('click', function() { return false; })
        .bind('dblclick', function() { window.location = this.href; });
    

    SSCCE :

    <!doctype html>
    <html lang="en">
        <head>
            <title>Test</title>
            <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
            <script type="text/javascript">
                $(document).ready(init);
                function init() {
                    $('a.dblclick')
                        .bind('click', function() { return false; })
                        .bind('dblclick', function() { window.location = this.href; });
                }
            </script>
        </head>
        <body>
            <a href="javascript:alert('link1')" class="dblclick">link1</a><br>
            <a href="javascript:alert('link2')" class="dblclick">link2</a><br>
            <a href="javascript:alert('link3')" class="dblclick">link3</a><br>
        </body>
    </html>
    
        5
  •  0
  •   Björn    15 年前

    如果您没有使用任何javascript框架,那么这可能是最好的。你可以摆脱你的功能;

    <a href="..." onclick="return false;" ondblclick="location.href='...';">Foobar</a>