jQuery无法输出正确的HTML

问题描述

我正在维护一个非常老的Rails 3项目，需要在其中添加新功能。 Bootstrap 4主要是响应能力。

这是我实际上要创建的：http://jsfiddle.net/k1zbe4o9/。如您所见，它可以在小提琴中完美地工作。但是，该项目使用jQuery动态更改HTML。 jQuery代码相当简单

if (best_price) {
  li_class = "list-group-item";
  li_class += " card-list-best";
}

我在函数中这样使用它：

var list_html = $("<li class=" + li_class + ">" + list_details_html + "</li>");

但是，当我执行此操作时，我得到了一个奇怪的信息，即jQuery无法正确返回此值，因此，不是将list-group-item card-list-best放在单个<li>类中，而是以某种方式获得了{{1} }超出此范围，结果如图所示。

如果我做同样的事情：

card-list-best

感谢您的帮助。

解决方法

构建for i in reversed(range(len(list_array))): 时可以添加'。

li

在示例中可以看到，我添加了一个控制台日志，它返回"<li class='" + li_class + "'>" + list_details_html + "</li>" ，因此如果在<li class=list-group-item card-list-best>test</li>之后没有"或'，它将取class=之后直到第一个空格的值，因此它将返回=

工作示例

<li class="list-group-item">test</li>

var li_class = "";
var list_details_html = "test";
li_class = "list-group-item";
li_class += " card-list-best";
var list_html = $(
  "<li class='" + li_class + "'>" + list_details_html + "</li>"
);

console.log("<li class=" + li_class + ">" + list_details_html + "</li>")

$('ul').append(list_html)