2

简而言之，我有一个希望用户能够点击的大框。当他们单击它时，它会导航到某个 URL。所以...一个链接。

（这个框里面确实有一个带有相应 HREF 的链接，但我希望整个框都可以点击）

有几个原因，让实际的锚点和盒子一样大对我的 HTML 布局来说真的很乱，而且我在盒子里有一堆块等等，所以我试图找到一个替代方案。

现在，我正在做的是：

$(box).click(function(){
  window.location.href = $(this).find("a.lnkWhatever").attr("href");
});

哪个有效......有点......但它不是一个链接，你不能按Ctrl +单击它以在新选项卡中打开它，右键单击不会为你提供通过链接获得的不错选项等。 .

我可以尝试看看当他们单击时是否碰巧按下了 Ctrl，但我觉得我总是会有一些令人憎恶的东西，以某种奇怪的方式或其他方式工作得不好......

有没有更好的方法来做到这一点，我错过了？

注意：我知道我可以将链接设置为一个大盒子，通常我会这样做，但在这种情况下，它确实有问题，我不需要这样做

谢谢！
丹尼尔

4

4 回答 4

1

你总是可以把a元素变成盒子。使用 css 显示它块。这是一个 JSFiddle 演示。

注意：仅单击演示不会像代码所示那样加载 Google。JSFiddle 在这里做了一些奇怪的事情，但是如果你 Ctrl + 单击它，它的行为与预期的一样。

或者！（因为你说这样做有问题）

您可以捕获click和contextmenu事件，找出触发了哪个事件并基于此更改操作。您可以使用一些类似于此演示的代码来完成此操作。

您将附加到锚点的 JavaScript 如下所示：

$('a').on('click contextmenu', function (event) {
    if (event.type === 'contextmenu') {
        //execute what code you want
    }
    else {
        // this would automatically navigate to your link
        // so you could theoretically leave off the else portion
        // it just seemed like a nice place to leave this explanation
    }
});​
于 2012-09-20T16:09:40.530 回答
0

如果框是相对定位的，您可以创建一个绝对定位的锚点作为 div 内的第一个元素，并将其大小设置为 100%。例子

编辑 - 固定链接

于 2012-09-20T16:16:50.743 回答
0

在内部锚点上尝试设置：

display: block; 
width: 100%;
height: 100%;

可能您可能还需要position: relative;在父容器上设置

见JsFiddle

于 2015-04-30T11:42:39.030 回答
0

你可以试试这样的

JS

$(document).ready(function() {
    $('#mydiv').click(function(e) {
        var a = $(this).find('a');
        if (e.ctrlKey) {
            a.attr('target', '_blank');
        }
        a[0].click();
    });
})​

HTML

<div id='mydiv'>
        hi world <br />
        <a href='http://www.google.com'>Google</a>
        Hello <br />
        blah
    </div>​

演示

但是我不确定是否.click()是跨浏览器。您可能需要考虑不同的浏览器

于 2012-09-20T16:35:15.630 回答