【问题标题】:What is this character "" and why does it cause a line break?这个字符“”是什么,为什么会导致换行?
【发布时间】:2012-12-18 07:24:21
【问题描述】:

我正在使用把手 + hbs(按照块/扩展帮助程序示例)为我的节点应用程序呈现 html。出于某种原因,我的一个 div 被推到了 1 行。

我检查了chrome中的dom检查器,有一行双引号:

这是什么原因造成的:

当我从 dom 检查器中删除双引号(按退格键或删除)时,布局正确:

这是怎么回事?它是非打印字符还是什么? html/模板中没有任何内容,空格(或任何字符)不应该导致块级元素改变位置,对吧?

这里有一些代码:
Layout.html的相关部分

<div id="details" class="east">{{{block "east"}}}</div>

模板:

<div id="details-title">
  <h3 class="title elide" style="height:26px;">{{Title}}</h3>
</div>
<div id="details-body" class="content text">
  <img class="card" src="{{ImagePath}}" />
  <div>
    <span class="type">{{Type}}</span>
  </div>
  <div class="body">
    {{{Body}}}
  </div>
</div>

块 + 扩展助手:(from the hbs example)

hbs.registerHelper("extend", function (name, context) {
    var block = blocks[name];
    if (!block) {
        block = blocks[name] = [];
    }

    if (typeof context.fn !== "undefined") {
        block.push(context.fn(this));
    }
});

hbs.registerHelper("block", function (name) {
    var val = (blocks[name] || [])
        .filter(function () { return true })
        .join("\n");

    // clear the block
    blocks[name] = [];
    return val;
});

更新 显然,这是char 65279,我的预编译车把模板在渲染时都将其作为第一个字符发出。

【问题讨论】:

  • 模板是什么样的?你给它提供什么数据?生成的 HTML 是什么样的?什么 CSS 生效?
  • 您应该发布您的 hbs,以便人们可以看到可能产生额外“”的原因
  • @muistooshort 我想我的意思是我已经排除了css、模板和数据。我试图弄清楚“”是什么字符以及它为什么会导致换行符。问题的标题可能不好。

标签: node.js layout handlebars.js


【解决方案1】:

所以我添加了一个技巧来删除作为模板输出中第一个字符出现的 BOM:

var html = detailTemplate(res.data);
if (html.charCodeAt(0) === 65279) { // hack to fix precompiled hbs template bug
  html = html.substring(1);
}
$("#details").html(html);

事实证明,块 + 扩展助手与问题无关。我假设这是我使用的编码有问题,但我不知道如何改变它。上面的代码解决了这个问题。

【讨论】:

    【解决方案2】:

    已解决,使用编码保存 > UTF-8

    【讨论】:

      猜你喜欢
      • 2021-12-25
      • 1970-01-01
      • 2013-02-25
      • 2014-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-10-02
      相关资源
      最近更新 更多