我有一个<div>块与一些花哨的视觉内容,我不想改变。我想让它成为一个可点击的链接。
我正在寻找类似于<a href="…"><div>…</div></a>,但这是有效的XHTML 1.1。
我有一个<div>块与一些花哨的视觉内容,我不想改变。我想让它成为一个可点击的链接。
我正在寻找类似于<a href="…"><div>…</div></a>,但这是有效的XHTML 1.1。
当前回答
只是有链接在块和增强它与jquery。对于没有javascript的任何人,它都可以100%优雅地降级。在我看来,用html来做这件事并不是最好的解决方案。 例如:
<div id="div_link">
<h2><a href="mylink.htm">The Link and Headline</a></h2>
<p>Some more stuff and maybe another <a href="mylink.htm">link</a>.</p>
</div>
然后使用jquery使块可点击(通过网页设计师墙):
$(document).ready(function(){
$("#div_link").click(function(){
window.location=$(this).find("a").attr("href"); return false;
});
});
然后你所要做的就是向div添加游标样式
#div_link:hover {cursor: pointer;}
为了加分,只有当javascript通过添加'js_enabled'类到div或body或其他东西来启用时才应用这些样式。
其他回答
虽然我不建议在任何情况下这样做,但下面是一些代码,它将DIV转换为链接(注意:本例使用jQuery,为了简单起见,删除了某些标记):
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("div[href]").click(function () {
window.location = $(this).attr("href");
});
});
</script>
<div href="http://www.google.com">
My Div Link
</div>
你不能让div本身成为一个链接,但是你可以让一个<a>标签作为一个块,与<div>具有相同的行为。
a {
display: block;
}
然后你可以设置它的宽度和高度。
需要一点javascript。 但是,你的div是可点击的。
<div onclick="location.href='http://www.example.com';" style="cursor:pointer;"></div>
我引入了一个变量,因为我的链接中的一些值将根据用户来自的记录而改变。 这适用于测试:
<div onclick="location.href='page.html';" style="cursor:pointer;">...</div>
这个也有用:
<div onclick="location.href='<%=Webpage%>';" style="cursor:pointer;">...</div>
这是一个古老的问题,但我想我应该回答它,因为这里的每个人都有一些疯狂的解决方案。其实非常非常简单……
锚标记是这样工作的-
<a href="whatever you want"> EVERYTHING IN HERE TURNS INTO A LINK </a>
Sooo ...
<a href="whatever you want"> <div id="thediv" /> </a>
虽然我不确定这是否成立。如果这就是口头解决方案背后的原因,那么我道歉……