在haml中將div或div作為href

Question

鑒於這種

<div class='postpreview'>
  <a href="/some/image/xyz"><img alt="xyz" src="/some/image/xyz" /></a>
  Some content, etc.
  <a href='/forums/post/123'>Show</a>
</div>

如何使整個div的“ postpreview”功能鏈接為“ / forums / post / 123”？ 在哈姆爾？

基本上，這是在rails部分內，並且鏈接被列為link_to等（共另一個問題）。 我可以使以上內容在haml中正常運行，我只是無法將整個div轉換為鏈接而不會出現錯誤，也不會在頁面上顯示輸出但沒有鏈接。 我想擺脫“顯示”鏈接，並把整個postpreview鏈接設為該帖子。

Answer 1

您需要使用JavaScript將點擊處理程序添加到div元素。 例如，如果給特定的div一個id，它就很簡單：

document.getElementById('myDivID').onclick = function() {
    window.location = '/forums/post/123'; 
}

或者如果你正在使用jQuery：

$('#myDivId').click(function() { window.location = ... });

請注意，div中有兩個鏈接-是否有意使第一個鏈接無法跟隨？

Answer 2

我認為Hamish對他的問題肯定是正確的。 你需要它嗎？ 否則，您可以殺死第一個，然后使用一些純HTML / CSS解決方案，該解決方案使用class postpreview在div中擴展每個a：

HTML

<div class="postpreview">
 <a href="/forums/post/123" rel="bookmark" title="Foo">
  <img src="/some/image/xyz.jpg" alt="foo" title="bar" />  
 </a>                        
</div>

CSS

.postpreview a {
  display: block;
  width: 100%;
  height: 100%;
}

根據您的圖片大小或更好的周圍div分別設置a元素的高度和寬度。

Answer 3

這是一個解決方案 - 圖像本身的鏈接會很好，或者更確切地說是下一步 - 生成此postpreview鏈接到post，其中縮略圖鏈接到圖像

以/開頭的行不能很好地工作，但open image_tag行確實鏈接到帖子打開的頁面，不需要js。

.postpreview
 %a{:href =>(url_for [@blog, post])}
  .postcontaincontain
   = image_tag(post.image_url(:thumb)) if post.image_url
   /= link_to image_tag(post.image_url(:thumb)), post.image_url if post.image_url
   = shout.content