1

为什么我的“footer_links”跨度提前结束（在我的删除 button_to 之前）：

%p
  %br
  %span.footer_links
    = link_to 'Edit', edit_link_path(@link)
    |
    = button_to 'Delete', @link, :confirm => 'Are you sure?', :method => :delete

正在生产这个：

<p>
<br/>
<span class="footer_links">
<a href="/links/354/edit">
<a href="/links/354/edit">
 | 
</span>
</p>
<form method="post" action="/links/354" class="button_to">
<div>
<input name="_method" type="hidden" value="delete"/>
<input data-confirm="Are you sure?" type="submit" value="Delete"/>
<input name="authenticity_token" type="hidden" value="MvN6K03y5WcqSZRt4Au3zj+xsKhfZ9EEtkf2M7YCGhk="/>
</div>
</form>
4

3 回答 3

4

基于“mu太短”的答案，将您的p和span元素更改为div（或其他有效的HTML）：

%div
  %br
  .footer_links
    = link_to 'Edit', root_path
    |
    = button_to 'Delete', current_user, :confirm => 'Are you sure?', :method => :delete

我猜你是从你的 Chrome（或 Safari 或 Firefox/Firebug）开发工具中的 Elements（又名 DOM）浏览器获得的“源代码”。这与查看 HAML 呈现的原始源不同。浏览器解析你的（无效的）源，它会尝试构建它可以使用的最好的 DOM，当你浏览 DOM 时，开发者控制台会将它作为文本转储出来。

开发者控制台中的文本表示很少会与原始源代码相同，尤其是在您的源代码无效的情况下。当您尝试调试渲染错误时，不要盯着这么多层纱布。从浏览器的菜单中选择“查看源代码”。

于 2012-06-01T02:47:04.170 回答
3

我猜你的 HAML 实际上正在产生这样的东西：

<p>
  <br/>
  <span class="footer_links">
    <a href="/links/354/edit">...</a>
     | 
    <form method="post" action="/links/354" class="button_to">
      <div>
        <input name="_method" type="hidden" value="delete"/>
        <input data-confirm="Are you sure?" type="submit" value="Delete"/>
        <input name="authenticity_token" type="hidden" value="MvN6K03y5WcqSZRt4Au3zj+xsKhfZ9EEtkf2M7YCGhk="/>
      </div>
    </form>
  </span>
</p>

但这不是有效的 HTML：你不能在<div><form><p>. 因此，当浏览器尝试解析 HTML 时，它会注意到它不是有效的 HTML，并尽最大努力更正您的 HTML。最简单的更正方法是将有问题的<form>元素推到外部<p>并关闭<span>and<p>元素，这将产生一个（有效的 HTML）结构，如下所示：

<p>...</p>
<form><div>...</div></form>

这看起来很像你所看到的。

解决方案是使用有效的 HTML，也许您可​​以使用<div class="p">而不是最外层<p>并调整 CSS 以使其div.p看起来像p. 您还必须替换<span>since<span>只能包含短语内容，就像<p>.

于 2012-06-01T01:41:18.187 回答
0

完全是猜测，但是您是否在缩进中混合了空格和制表符？看起来 HAML 将 button_to 标记解释为与 %p 标记在同一级别缩进，所以我想知道是否有一个选项卡可能被解释为空格。

HAML 文档说您不能在缩进中混合制表符和空格，但它没有说明这是否会引发错误或显示为意外行为。

于 2012-06-01T01:20:55.937 回答