Jquery 显示：无；元素模糊，通过引导向右浮动

我这里有点神秘的问题

我正在使用名为

treeemenu.js的
javascript
来隐藏和显示
ul
列表。它通过在
display:none和
显示：块

但是我也安装了
Bootstrap.css
。不知怎的，这使得我的
ul
s模糊不清，并向右对齐

我怎样才能防止这种情况发生

这就是treemenu的样子，我已经突出显示了隐藏的
ul
s子
li
s：

突出显示的
ul
s应向左对齐，其余部分为黑色。不是像这样飘飘然。
必须添加的是，列表中没有添加任何
bootstrap
类


编辑：

代码如下：

CSS，而不是引导

.menu ul{
margin:0px;
padding:0px;
text-decoration:none;
}
.menu li{
    margin:0px 0px 0px 5px;
    padding:0px;
    list-style-type:none;
    text-align:left;
    font-family:Arial,Helvetica,sans-serif;
    font-size:13px;
    font-weight:normal;
}
    .menu li li{
        margin:0px 0px 0px 16px;
    }

.menu .symbol-item,
.menu .symbol-open,
.menu .symbol-close
{
float:right;
width:16px;
height:1em;
background-position:left center;
background-repeat:no-repeat;
}
.menu .symbol-item  { background-image:url(../Icons/page.png); }
.menu .symbol-close { background-image:url(../Icons/plus.png);}
.menu .symbol-open  { background-image:url(../Icons/minus.png); }
.menu .symbol-item.last  { }
.menu .symbol-close.last { }
.menu .symbol-open.last  { }

.menu li.item  { font-weight:normal; }
.menu li.close { font-weight:normal; }
.menu li.open  { font-weight:bold; }
.menu li.item.last  { }
.menu li.close.last { }
.menu li.open.last  { }

a.go:link, a.go:visited, a.go:active
    {
    display:block;
    height:26px;
    width:100px;
    background-color:#FFFFFF;
    color:black;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    font-weight:bold;
    text-align:right;
    text-decoration:none;
    line-height:26px;
    padding-right:30px;
    background-image:url(go.gif);
    background-position:right;
    background-repeat:no-repeat;
    }
a.go:hover
    {
    text-decoration:none;
    color:black;
    }

.menu_move li {
list-style-type:none;
}
.menu_move li.item  { font-weight:normal; }
.menu_move li.close { font-weight:normal; }
.menu_move li.open  { font-weight:bold; }
.menu_move li.item.last  { }
.menu_move li.close.last { }
.menu_move li.open.last  { }
.menu_move .symbol-item,
.menu_move .symbol-open,
.menu_move .symbol-close
    {
    float:right;
    width:16px;
    height:1em;
    background-position:left center;
    background-repeat:no-repeat;
    }
.menu_move .symbol-item  { background-image:url(../Icons/page.png); }
.menu_move .symbol-close { background-image:url(../Icons/plus.png);}
.menu_move .symbol-open  { background-image:url(../Icons/minus.png); }
    .menu_move .symbol-item.last  { }
    .menu_move .symbol-close.last { }
    .menu_move .symbol-open.last  { }

Treeemenu.js

TreeMenu.SymbolTag = 'span';            // symbol inserted at beginning of <LI> tags

TreeMenu.OmitSymbols = false;           // don't insert symbol but do adjust them

TreeMenu.SymbolClassItem = 'glyphicon glyphicon-book pointer';              // No subfolders
TreeMenu.SymbolClassClose = 'glyphicon glyphicon-chevron-right pointer';    // Subfolders is hidden
TreeMenu.SymbolClassOpen = 'glyphicon glyphicon-chevron-down pointer';      // Subfolders is shown

TreeMenu.ClassItem  = 'item';           // class name added to <LI> tag's class
TreeMenu.ClassClose = 'close';          // class name added to <LI> tag's class
TreeMenu.ClassOpen  = 'open';           // class name added to <LI> tag's class
TreeMenu.ClassLast  = 'last';           // added to last <LI> and symbol tags' classes

TreeMenu.CookieSaveStates = true;       // flag to use a cookie to save menu state
TreeMenu.CookieExpire = 1;              // days before cookie saving menu states expires

TreeMenu.SetupMenu = true;          // scan document objects to initialize menu

TreeMenu.Singular = false;          // restrict open menus to only one per level

/////// End of Configuration Variables ///////////////////

function make_tree_menu(id,omit_symbols,no_save_state,singular,no_setup) {
var m = new TreeMenu(id);
if (omit_symbols) m.OmitSymbols = true;
if (no_save_state) m.CookieSaveStates = false;
if (singular) m.Singular = true;
if (no_setup) m.SetupMenu = false;
// Setup menus if we are inserting symbols or restoring menu open/close states.
if (m.SetupMenu) m.setup_symbols();
return m;
}

/*
 * TreeMenu
 */

function TreeMenu(ul_id) {          // object constructor

this.top_ul_id = ul_id;
this.top_ul = document.getElementById(ul_id);

this.configure();

// Register menu
TreeMenu.menus[ul_id] = this;

return this;
}

/*
 * TreeMenu Class Variables
 */

TreeMenu.menus = [];                // list of defined menus

/*
 * TreeMenu Class Methods
 */

TreeMenu.toggle = function(e) {
e = TreeMenu.get_ref(e);
var m = TreeMenu.menus[TreeMenu.get_top_ul(e).id];
var li = TreeMenu.get_li(e);
var ul = li.getElementsByTagName("UL")[0];
if (ul.style.display == "block") {
    m.hide_menu(ul, li, e);
}
else {
    if (m.Singular) m.hide_menus_except(li);
    m.show_menu(ul, li, e);
}

m.save_menu_states();
}

TreeMenu.show = function(ul) {
ul = TreeMenu.get_ref(ul);
var top_ul = TreeMenu.get_top_ul(ul);
if (! top_ul) return;
var m = TreeMenu.menus[top_ul.id];
var li = TreeMenu.get_li(ul);
m.show_menu(ul,li);
}

TreeMenu.hide = function(ul) {
ul = TreeMenu.get_ref(ul);
var top_ul = TreeMenu.get_top_ul(ul);
if (! top_ul) return;
var m = TreeMenu.menus[top_ul.id];
var li = TreeMenu.get_li(ul);
m.hide_menu(ul,li);
}

TreeMenu.show_all = function(ul) {
// Show all menus under ul.
ul = TreeMenu.get_ref(ul);
var uls = ul.getElementsByTagName("UL");
for (i = 0; i < uls.length; i++) {
    TreeMenu.show(uls[i]);
}
}

TreeMenu.hide_all = function(ul) {
// Hide all menus under ul.
ul = TreeMenu.get_ref(ul);
var uls = ul.getElementsByTagName("UL");
for (i = 0; i < uls.length; i++) {
    TreeMenu.hide(uls[i]);
}
}

TreeMenu.save_state = function(ul) {
// Reset menu to original settings.
ul = TreeMenu.get_ref(ul);
var m = TreeMenu.menus[TreeMenu.get_top_ul(ul).id];
m.save_menu_states();
}

TreeMenu.reset = function(ul) {
// Reset menu to original settings.
ul = TreeMenu.get_ref(ul);
var m = TreeMenu.menus[TreeMenu.get_top_ul(ul).id];
m.reset_menu_states();
}

// Private methods
TreeMenu.get_ref = function(id) {
    if (typeof id == "string") return document.getElementById(id);
return id;
}

TreeMenu.get_top_ul = function(e) {
while (e && (e.nodeName != 'UL' || ! e.id || ! TreeMenu.menus[e.id])) e = e.parentNode;
return e;
}

TreeMenu.get_li = function(e) {
while (e && e.nodeName != 'LI') e = e.parentNode;
return e;
}


/*
 * TreeMenu Object Methods
 */

TreeMenu.prototype.configure = function() {

    // Assign global class settings (capitalized variables) to object settings.

    var v,c;
    for (v in TreeMenu) {
            c = v.substr(0,1);
            if (c == c.toUpperCase()) {
                    this[v] = TreeMenu[v];
            }
    }
}

TreeMenu.prototype.setup_symbols = function() {

// Insert open/close symbols at the beginning of the menu items
// and open or close menus like they were previously.

var states = this.get_menu_states();

var index = 0;
var ul, li, symbol, islast = false;
var ul_elements, li_elements = this.top_ul.getElementsByTagName("LI");
for(var i=0; i < li_elements.length; i++) {
    li = li_elements[i];

    if (this.ClassLast) islast = this.is_last_item(li);

    ul_elements = li.getElementsByTagName("UL");
    if(ul_elements.length > 0) {
        // Submenus
        if (this.SymbolTag && ! this.OmitSymbols) {
            symbol = document.createElement(this.SymbolTag);
            if (this.ClassLast && islast) symbol.className = this.ClassLast;
            symbol.onclick = function() { TreeMenu.toggle(this); };
            li.insertBefore(symbol, li.firstChild);
        }

        ul = ul_elements[0];
        if (states[index] == '1') this.show_menu(ul,li);
        else                      this.hide_menu(ul,li);
        index++;
    }
    else {
        // Menu item
        if (this.SymbolTag && ! this.OmitSymbols) {
            symbol = document.createElement(this.SymbolTag);
            if (this.SymbolClassItem)
                symbol.className = this.SymbolClassItem;
            if (this.SymbolSrcItem)
                symbol.src = this.SymbolSrcItem;
            if (this.ClassLast && islast)
                symbol.className += ' ' + this.ClassLast;
            li.insertBefore(symbol, li.firstChild);
        }

        if (this.ClassItem) li.className += ' ' + this.ClassItem;
    }

    if (islast) li.className += ' ' + this.ClassLast;
}
}

TreeMenu.prototype.is_last_item = function(e) {
// Check if element is the last LI element in the list.
e = e.nextSibling;
// Get next element (Mozilla puts text nodes at same level here).
while (e && e.nodeType != 1) e = e.nextSibling;
return e ? false : true;
}

TreeMenu.prototype.get_menu_states = function() {
var cookie = getCookie("tm_" + this.top_ul_id);
if (cookie) return cookie.split('x');
return [];
}

TreeMenu.prototype.save_menu_states = function() {

// Save all menu and submenu open/close states in a cookie

if (! this.CookieSaveStates) return;

var states = [];
var ul_elements, li_elements = this.top_ul.getElementsByTagName("LI");
for(var i=0; i < li_elements.length; i++) {
    ul_elements = li_elements[i].getElementsByTagName("UL");
    if (ul_elements.length > 0) {
        states[states.length] = ul_elements[0].style.display == "block" ? 1 : 0;
    }
}

var expire_date = new Date((new Date().getTime()) + this.CookieExpire*24*60*60*1000);
setCookie("tm_" + this.top_ul_id, states.join('x'), expire_date, '/');
}

TreeMenu.prototype.reset_menu_states = function() {

// Reset all menu and submenu open/close states  (delete cookie)

var expire_date = new Date((new Date().getTime()) - 1000);      // set to past time
setCookie("tm_" + this.top_ul_id, '', expire_date, '/');
}

TreeMenu.prototype.add_remove_class = function(e,add_class,remove_class) {
if (e) {
    if (remove_class)
        e.className = e.className.replace(remove_class,'');
    if (add_class && ! e.className.match( (new RegExp("\\b"+add_class+"(\\s.*)?")) ) ) {
        e.className += ' ' + add_class;
    }
}
}

TreeMenu.prototype.show_menu = function(ul,li,e) {
ul.style.display = 'block';

this.add_remove_class(li,this.ClassOpen,this.ClassClose);

if (this.SymbolTag) {
    var symbol = li.getElementsByTagName(this.SymbolTag)[0];
    this.add_remove_class(symbol,this.SymbolClassOpen,this.SymbolClassClose);
    if (this.SymbolSrcOpen) symbol.src = this.SymbolSrcOpen;
}

// Following case is for toggle buttons disassociated with menu structure.
this.add_remove_class(e,this.SymbolClassOpen,this.SymbolClassClose);
}

TreeMenu.prototype.hide_menu = function(ul,li,e) {
ul.style.display = 'none';

this.add_remove_class(li,this.ClassClose,this.ClassOpen);

if (this.SymbolTag) {
    var symbol = li.getElementsByTagName(this.SymbolTag)[0];
    this.add_remove_class(symbol,this.SymbolClassClose,this.SymbolClassOpen);
    if (this.SymbolSrcClose) symbol.src = this.SymbolSrcClose;
}

// Following case is for toggle buttons disassociated with menu structure.
this.add_remove_class(e,this.SymbolClassClose,this.SymbolClassOpen);
}

TreeMenu.prototype.hide_menus_except = function(li) {
// Hide other menus at same level as li.
var n;
var re = new RegExp('\\b' + this.ClassOpen + '\\b');
for (var i = 0; i < li.parentNode.childNodes.length; i++) {
    n = li.parentNode.childNodes[i];
    if (n == li || n.nodeType != 1) continue;
    if (n.className.match(re)) this.hide_menu(n.getElementsByTagName("UL")[0],n);
}
}

treeemenu.SymbolTag='span'；//在标签的开头插入符号
treeemenu.omit symbols=false；//不要插入符号，但要调整它们
treeemenu.SymbolClassItem='glyphicon glyphicon书本指针'；//没有子文件夹
treeemenu.SymbolClassClose='glyphicon glyphicon V形右指针'；//子文件夹是隐藏的
treeemenu.SymbolClassOpen='glyphicon glyphicon V形向下指针'；//将显示子文件夹
treeemenu.ClassItem='item'；//类名称添加到
标记的类
treeemenu.ClassClose='close'；//类名称添加到
标记的类
treeemenu.ClassOpen='open'；//类名称添加到
标记的类
treeemenu.ClassLast='last'；//添加到最后的
和符号标记类
treeemenu.CookieSaveStates=true；//使用cookie保存菜单状态的标志
treeemenu.CookieExpire=1；//cookie保存菜单状态过期的前几天
treeemenu.SetupMenu=true；//扫描文档对象以初始化菜单
TreeMenu.Singular=false；//将打开的菜单限制为每个级别仅一个
///////配置变量结束///////////////////
函数生成树菜单（id、省略符号、无保存状态、单数、无设置）{
var m=新树单元（id）；
如果（省略符号）m.OmitSymbols=true；
如果（无保存状态）m.CookieSaveStates=false；
如果（单数）m.单数=真；
如果（无设置）m.SetupMenu=false；
//如果插入符号或恢复菜单打开/关闭状态，则设置菜单。
如果（m.SetupMenu）m.setup_符号（）；
返回m；
}
/*
*特雷梅努
*/
函数树（ul_id）{//对象构造函数
this.top\u ul\u id=ul\u id；
this.top_ul=document.getElementById（ul_id）；
这是configure（）；
//注册菜单
树菜单[ul_id]=此；
归还这个；
}
/*
*TreeMenu类变量
*/
树菜单=[]；//已定义菜单的列表
/*
*TreeMenu类方法
*/
TreeMenu.toggle=功能（e）{
e=treeemenu.get_ref（e）；
var m=TreeMenu.menu[TreeMenu.get_top_ul（e.id）]；
var li=Treeemenu.get_li（e）；
var ul=li.getElementsByTagName（“ul”）[0]；
如果（ul.style.display==“块”）{
m、 隐藏菜单（ul、li、e）；
}
否则{
如果（m.单数）m.隐藏菜单（li除外）；
m、 显示菜单（ul、li、e）；
}
m、 保存菜单状态（）；
}
树显示=功能（ul）{
ul=树的获取参考值（ul）；
var top_ul=树。获取top_ul（ul）；
如果（！top_ul）返回；
var m=树菜单[top_ul.id]；
var li=Treeemenu.get_li（ul）；
m、 显示菜单（ul、li）；
}
TreeMenu.hide=函数（ul）{
ul=树的获取参考值（ul）；
var top_ul=树。获取top_ul（ul）；
如果（！top_ul）返回；
var m=树菜单[top_ul.id]；
var li=Treeemenu.get_li（ul）；
m、 隐藏菜单（ul、li）；
}
treeemenu.show_all=功能（ul）{
//显示ul下的所有菜单。
ul=树的获取参考值（ul）；
var uls=ul.getElementsByTagName（“ul”）；
对于（i=0；i0）{
//子菜单
if（this.SymbolTag&！this.omit符号）{
symbol=document.createElement（this.SymbolTag）；
如果（this.ClassLast&&islast）symbol.className=this.ClassLast；
symbol.onclick=function（）{TreeMenu.toggle（this）；}；
li.insertBefore（符号，li.firstChild）；
}
ul=ul_元素[0]；
如果（说明[索引]==
@helper tree(int parentId, List<Subjects> subjects)
{
foreach (var s in subjects)
{
    if (s.subfolderTo == parentId)
    {
        <li>
            <a href="/Chapter/Read?chapterId=@s._id&noteId=0">@s.subject</a>

            @{
                if (Subjects.GotSubFolder(s._id, subjects))
                {
                    <ul>
                        @tree(s._id, subjects)
                    </ul>
                }
            }
        </li>
    }
}
}

<div id="Menu_Overview">
@message
<div class="menu">
    <ul id="menu_id">
        @tree(0, subjects)
    </ul>
    <script type="text/javascript">make_tree_menu("menu_id")</script>
</div>
</div>