Question

我搜索过的所有内容都显示了制作一个完整的div可点击，我想知道的是，是否可以使用javascript和div ID在可点击链接中创建div？

更新：

抱歉，我认为我对我的问题非常模糊，所以我会更详细地介绍一下。我有一个框的布局，如果我的数据库中有一个值，我希望PHP将一些值回显到javascript中，并说如果这个框被采用，给这个div（boxID）提供与数据库相关的链接。只是，每个div上都没有链接，因为数据库中不存在某些链接。

希望这能提供更多细节。我想替代方法是将每个div包装在一个标签和一个if exists语句中？

Answer 1

纯粹的JS：

document.getElementById('your-div').addEventListener('click', function() {
    location.href = 'http://your-url.com'
}, false);

通过jQuery

$('#your-div').on('click', function() {
    location.href = 'http://your-url.com'    
});

Answer 2

在html5中，您可以这样做：

<a href="link"><div>test</div></a>

Answer 3

你可以很容易地做到这一点，当你点击你的div你会转到另一个页面，就像这样（使用jQuery）

$('#myId').click(function () {
    window.location = 'newurl.php';
});

Answer 4

此解决方案适用于html＆lt; = 4.对于html5，请阅读@Spencer解决方案。

由于javascript可能不是您想要的（等待额外的评论），这里有一个如何在纯html / css中执行此操作的示例。一个完全填充div的锚标记，使 div可点击。

HTML：

<div>
  <a href = "http://whatever.com/">
  </a>
</div>

的CSS：

div {
    width: 200px;
    height: 200px;
    position: relative;
    background-color: red;
}
a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 255, 0, 0.5);
}

jsfiddle中的演示（为演示目的而添加了背景色）：

http://jsfiddle.net/Gx3f5/

在Javascript中创建一个div链接？

4 个答案: