HTML标题属性仅显示第一个单词

Question

我正在使用jQuery中的标题属性。

createAlert: function () {            
  return '<img id="img" class="img pull-left" src="/Content/img/demo_16px.png" tabindex="0" style="outline: none;" title=' + demo.rawData + '></span>';
}

在这段代码中，标题包含动态数据（demo.rawData 包含文本 = 'This is my code'）。

但是，当我在浏览器中悬停标题时，它只显示 This（即仅显示第一个单词）。

有人能告诉我我做错了什么吗？

- Sanjiv

---

在你的属性值周围添加引号。 - John Ellmore

Answer 1

您需要像这样用""包围标题：title="' + demo.rawData + '"，而不是title=' + demo.rawData + '，否则渲染的HTML将无效。

createAlert: function () {            
  return '<img id="img" class="img pull-left" src="/Content/img/demo_16px.png" tabindex="0" style="outline: none;" title="' + demo.rawData + '"></span>';
}

- DGS

Answer 2

这里提供另一种使用 ES6 模板字面量的解决方案：

createAlert: function () {            
  return `<img id="img" class="img pull-left" src="/Content/img/demo_16px.png" tabindex="0" style="outline: none;" title="${demo.rawData}"></span>`;
}

参考文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

这个文档介绍了JavaScript中的模板字面量。使用模板字面量可以更方便地创建字符串，同时还可以插入变量和表达式。模板字面量使用反引号（`）包裹，并在其中使用${}来插入变量或表达式。

- Shiladitya