Question

我有一个页面（小部件）的一部分，我想用它作为链接（点击任何地方将转到另一页）：

<!-- just an example. real application is quite a bit more complex -->
<div data-href="/page">
   <h1><a href="/page">Title of sample content</a></h1>
   <p>
        some content here with an image
        <img src="image.jpg">
   </p>
   <div>
        and many more elements in here
        <div>
             with nested structure with semantic meaning
        </div>
   </div>
</div>

由于该部分为<div>，因此我无法将其包裹在<a>内，因为这违反了HTML规范。我也无法将divs更改为span，因为它们实际上具有语义含义。

目前我附加了一个JS click事件，我在该事件中更改了浏览器位置，该位置实际上可用作链接：

$('div').click(function() {
    window.location=$(this).data("href");
});

除非您Ctrl+Click上的Cmd+Click或<a>打开新标签中的链接，否则此方法无效。因为为此您没有明确地进行右键单击，浏览器将其注册为单击，因此无论如何都会执行该函数。

我想我可以检查点击事件是否按下了任何修改键，但我觉得这有点麻烦。有一个很好的JS解决方案吗？

Answer 1

你可以做这样的事情（点击处理程序的jQuery）：

$(selector).click(function(e) {
  if(e.shiftKey) {
    //Shift-Click
  }
  if(e.ctrlKey) {
    //Ctrl+Click
  }
  if(e.altKey) {
    //Alt+Click
  }
});

你可以在上面的点击处理程序中处理你想要的任何内容，如上所示

使用DIV作为链接触发器重定向新选项卡快捷方式

1 个答案: