javascript - Bootstrap 导览模板未在所有按钮上应用 id

Question

我在下一个按钮中添加了一个 id，以按照引导程序中的模板标签对其进行样式设置。我为下一个按钮应用了一个新的 id，但它只应用到第一个按钮，而不是后面的阶段。有谁知道为什么？

template: "<div class='popover tour'>
<div class='arrow'></div>
<h3 class='popover-title'></h3>
<div class='popover-content'></div>
<div class='popover-navigation'>
    <button class='btn btn-default' data-role='prev'>« Prev</button>
    <span data-role='separator'>|</span>
    <button class='btn btn-default' id="thisone" data-role='next'>Next »</button>
</div>
<button class='btn btn-default' data-role='end'>End tour</button>
</nav>
</div>",

Answer 1

问题是您多次使用 id ，请改用class。id 应该是唯一的。所以要小心。

从：

id="thisone"

到：

class="thisone"

您可以在此处阅读有关该问题的更多信息：https ://stackoverflow.com/a/11114634/2649456

Answer 2

我解决了。我使用类而不是 id 来定位元素，因为我的要求一般不是单一的。

.popover-navigation *[data-role="next"]{
    background-color:#c6c6c6;
}