仅在双击时激活链接

我正在为我的网站构建一个非常简单的基于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>

来源

2009-11-10 MalphasWats

它看起来像一个合理的办法......你有什么不开心的呢？ – jheddings 2009-11-10 18:32:00

这是'dolink（this）'和'window.location = ...'，当链接以非混乱形式很好地工作时，感觉很笨拙。我可能会将其重新设置为“逐步增强”，系统已经为每个文件显示了一个包含重命名/删除等选项的新页面，我只是想让它变得有点爵士乐。 – MalphasWats 2009-11-10 18:43:28

我所能提供的唯一反馈是人们期待链接的工作方式......只要你适当地设计它，以免让人混淆，我认为这是一个很好的方法。如果你有一个框架来帮助你，它可以帮助你从HTML中解决一些“混乱”问题。 – jheddings 2009-11-10 18:49:35

我会避免这样做，因为它违背了用户的期望如何选址网站向功能，但如果你一定要，你这样做是我所知道的唯一出路的方式。

另外，如果javascript被禁用或不可用，您应该知道该网站将回退到可单击的链接。

来源

2009-11-10 18:30:39

我同意，网站它真的只为我自己使用，'nullClick'方法实际上会重新链接看起来'选定'。 – MalphasWats 2009-11-10 18:33:35

他需要的不仅仅是忽略onclick，因此在示例中，nullClick（）函数确实有意义。再次阅读这个问题 - “我希望能够通过单击来选择它们，以便我可以执行重命名等操作” – 2009-11-10 18:35:36

我明白了，然后忽略我之前对删除函数的评论。我编辑了我的答案。 – 2009-11-10 18:43:02

<a href="http://pathtofile" onclick="return false" ondblclick="window.location = 'some where'">Clicky</a>

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

来源

2009-11-10 18:32:20 Tarik

如果你没有使用任何JavaScript框架，那可能就像它得到的那样好。你可以摆脱你的职责;

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

来源

2009-11-10 18:32:35

如果你不反对小jQuery：

$("#yourLinkId").dblclick(function() { 
     window.location($(this).attr("href")); 
    });

来源

2009-11-10 18:37:29

不是jQuery的粉丝，感觉太像作弊了:) – MalphasWats 2009-11-10 18:39:11

我知道你的意思，但使用它五分钟后，我被卖了:) – Thomas 2009-11-10 18:43:19

为什么不作弊，当你可以？ – 2009-11-10 18:43:54

有关使用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>

来源

2009-11-10 18:41:00 BalusC

仅在双击时激活链接

回答

相关问题