Question

我正在开发一个用ruby和haml开发的应用程序，现在我需要在元素上显示工具提示，工具提示也将包含图像，所以这个工具提示将是一个HTML。

我的html sctructure for tooltip就像

<li><a href="www.example.com" class='empty-space-tooltip' title='<img src="images/info.png" width="300" height="150" alt="Info" />'>
    <img src="images/info.png" width="16" height="16" alt="Info" /></a>
    <a href="www.example.com" class="main-link" title='<img src="images/info.png" width="300" height="150" alt="Info" />'><span>Title</span></a></li>

如何在HAML中写入我正在尝试使用代码

%li 
   %a{:href => "#/", :title => '%img{alt: "", height: "150", src: "images/info.png", width: "300"}/'} Send
   %a{:href => "#/", :title => '%img{alt: "", height: "150", src: "images/info.png", width: "300"}/'} Title

Answer 1

使用htmltohaml.com并删除所有反斜杠：

%li
  %a.empty-space-tooltip{:href => "www.example.com", :title => "<img src="images/info.png" width="300" height="150" alt="Info" />"}
    %img{:alt => "Info", :height => "16", :src => "images/info.png", :width => "16"}/
  %a.main-link{:href => "www.example.com", :title => "<img src="images/info.png" width="300" height="150" alt="Info" />"}
    %span Title

HAML中工具提示的元素的Title属性中的Html

1 个答案: