jQuery + handlebars IE8 value 属性包含其他属性答案

【问题标题】：jQuery + handlebars IE8 value attribute contains other attributejQuery + handlebars IE8 value 属性包含其他属性
【发布时间】：2013-10-08 18:15:59
【问题描述】：

我正在使用 Handlebars.js 和 jquery 检索 HTML 模板并呈现它。在不同的浏览器（IE10、IE9、FF、Safari、Chrome）中，这都能完美运行。

但是，当使用 IE8 时，这根本无法正常工作。我正在尝试使用输入字段呈现表单。字段确实出现在页面中，但是 value 属性填充了另一个属性。

举例：

<input id="lastName" autocomplete="off" required="" value="name=lastName"/>

我希望：

<input id="lastName" autocomplete="off" required="" value="" name="lastName" />

在模板中看起来像“：

<input id="lastName" autocomplete="off" required="" value="{{lastName}}" name=lastName/>

只有当需要由车把加载的变量 lastName 为空时才会发生这种情况。当此变量不为空时，它将加载此变量并显示正确的 html，如下所示：

<input name="lastName" id="lastName" autocomplete="off" required="" value="Plaap"/>

我刚刚发现文件的编译确实有问题。编译版本中的属性似乎失去了双引号。

当我提醒页面的编译版本时，这是 IE8 中 div 的样子：

 <INPUT id=lastName value= name=lastName autocomplete="off" required>

这将在 IE8 中的 HTML 中最终导致：

  <input id="lastName" autocomplete="off" required="" value="name=lastName"/>

在 Firefox 中查看相同的警报，这就是相同的输入：

  <input id="lastName" name="lastName" autocomplete="off" required="" value="" type="text">

这里是加载模板的脚本：

 var htmlSource = $(data).html();
 var template = Handlebars.compile(htmlSource);

 //fill template with object or ''
 var compiled = template(OF.address.attributes);
 alert(compiled);

 //now place the completely compiled html into the page
 that.$el.html(compiled);

这里有没有人以前遇到过这个问题或知道如何防止这种情况发生？

【问题讨论】：

创建一个 jsfiddle 来演示这个问题，它可以帮助其他开发人员帮助您，也可以帮助您抽象错误并修复它。
好吧，我没有遇到同样的问题，但与此类似。检查您的页面文档类型，并在模板中使用空格时，尝试重新排列属性，它可以帮助您。
嗨拉维，感谢您的回复。我认为脚本对于 jsfiddle 来说太复杂了。我正在使用 HTML5 并重新排列属性，这在值中出现的其他属性中得到了解决。

标签： jquery backbone.js requirejs handlebars.js

【解决方案1】：

在找到解决方案几个小时后，我找到了这个脚本：innerXHTML

这完美地工作并且成功了。 IE8 中不再有坏字段。

【讨论】：