引导:风格=“显示:none"Get& #39;s自动添加到'li'中

bootstrap: style="display:none" get's automatically appended in the 'li'

本文关键字:添加 li Get 显示 none 引导 quot 风格      更新时间:2023-09-26

在我的jsp中有以下一段代码。

<li id="report" class="dropdown open"><a data-toggle="dropdown" class="dropdown-toggle" href="#">Report <b class="caret"></b></a>
    <ul class="dropdown-menu">
              <li ><a href="#">Action</a></li>
              <li><a href="#">Another action</a></li>
              <li><a href="#">Something else here</a></li>
              <li class="divider"></li>
              <li class="nav-header">Nav header</li>
              <li style=""><a href="#">Separated link</a></li>
              <li><a href="#">One more separated link</a></li>
    </ul>
</li>

,但是当它在浏览器中呈现时,代码自动变为如下:

<li id="report" class="dropdown open"><a data-toggle="dropdown" class="dropdown-toggle" href="#">Report <b class="caret"></b></a>
    <ul class="dropdown-menu">
              <li style="display: none;"><a href="#">Action</a></li>
              <li style="display: none;"><a href="#">Another action</a></li>
              <li style="display: none;"><a href="#">Something else here</a></li>
              <li class="divider" style="display: none;"></li>
              <li class="nav-header" style="display: none;">Nav header</li>
              <li style="display: none;"><a href="#">Separated link</a></li>
              <li style="display: none;"><a href="#">One more separated link</a></li>
    </ul>
</li>

我无法理解从哪里所有的li's得到这个style="display:none"属性,是一些bootstrap javascript正在做它。我正在调试chrome上的代码。

我无法跟踪,哪个js正在对我的列表进行更改,所以我所做的是,我将每个li放在一个名为'visible'的类中,并在我的标签中添加如下样式:

<style>
.visible{
display:inline !important;
}
</style>

这个问题发生在Magento(1.9版本对我来说),它是由prototype JS库和jQuery之间的不兼容引起的。这里有一个修复

这很正常:添加样式是为了在未单击相关按钮时隐藏下拉菜单。这个控制是由JavaScript执行的(检查bootstrap.js)。