1

我正在尝试隐藏 jquery ui 菜单小部件的子菜单图标（默认值为ui-icon-carat-1-e）。

$(document).ready(function(){
    $(function() {
        $( "#menu" ).menu({
            icons: { 
                submenu: false
            }
        });
    });
});

我想解决方案很简单，但我不明白:-(

谢谢你们的帮助，伙计们。

编辑：这是我的 html 代码：

<ul id="menu" style="z-index:1">
    <li><a href="#"><span class="ui-icon ui-icon-info" style="margin: 3px 0 0 4px;"></span>Information </a>
        <ul>
            <li><a href="?site=something"><span class="ui-icon ui-icon-star" style="margin: 2px 0 0 4px;"></span>Something</a></li>
            <li>...</li>
...
        </ul>
    </ul>

这是 jquery 完成后的代码：

<ul id="menu" class="ui-menu ui-widget ui-widget-content ui-corner-all ui-menu-icons" style="z-index:1" role="menu" tabindex="0" aria-activedescendant="ui-id-152">
    <li class="ui-menu-item" role="presentation">
        <a id="ui-id-152" class="ui-corner-all" href="#" aria-haspopup="true" tabindex="-1" role="menuitem">
            <span class="ui-menu-icon ui-icon ui-icon-carat-1-e"></span>
            <span class="ui-icon ui-icon-info" style="margin: 3px 0 0 4px;"></span>
                Information 
        </a>
        <ul class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none; top: 31px; left: 20px;" role="menu" aria-expanded="false" aria-hidden="true">
            <li class="ui-menu-item" role="presentation"> … </li>
            <li class="ui-menu-item" role="presentation"> … </li>
            <li class="ui-menu-item" role="presentation"> … </li>
            <li class="ui-menu-item" role="presentation"> … </li>

我想删除这个烦人的跨度标签span class="ui-menu-icon ui-icon ui-icon-carat-1-e"

干杯亚历克斯

4

2 回答 2

4

以前的答案是一个糟糕的黑客。您可以使用适当的设置来删除图标，这将在图标通常所在的位置留下一个空白区域。使用 CSS 删除图标的额外间距。你可以两者都做，或者只是 CSS 部分。

Javascript 菜单初始化（可选更改 - css 将其完全隐藏）：

$("#mymenu").menu({
    icons: {submenu: 'ui-icon-blank'}
});

CSS 更改：

#mymenu .ui-menu-icon{display: none;}
#mymenu.ui-menu .ui-menu-item{padding: 3px 3px 3px 3px;}
于 2016-09-12T21:59:41.100 回答
3

使用 jquery 解决方案的工作小提琴

基本上你可以通过使用 jquery remove 命令来做到这一点。

JS（初始化小部件后运行）

$('.ui-menu-icon.ui-icon.ui-icon-carat-1-e').remove();
于 2013-08-14T21:14:40.410 回答