Question

我使用CODNITIVE的侧栏导航菜单专业版为Magento，我试图在默认情况下进行扩展。特别是我需要一个解决方案来默认扩展第一个列表项。我尝试在app / code / community / codnitive / sidenav / block /中编辑Navigation.php：

    $collapsibleClass = '';
    if ($config->isCollapsible()) {
        $collapsibleClass = ' collapsible';
    }

    // add collapsible arrow and wrraper
    $arrow = '';
    $extraStyle = '';
    $collapsibleIconPosition = $config->getCollapsibleIconPosition();
    if ($config->isCollapsible()) {
        $width = $config->getCollapsibleIconType() === 'arrow' ? 8 : 16;
        $height = 0;
        $expanded = 0;
        if ($hasActiveChildren) {
            $width = $config->getCollapsibleIconType() === 'arrow' ? 8 : 16;
            $height = 16;
        }
        if ($height == 0) {
            $extraStyle = ' display:none;';
        }
        if ($height == 0 && $collapsibleIconPosition === 'left') {
            $liMarginLeft += $width;
        }
        if ($this->isCategoryActive($category)) {
            $expanded = 1;
        }

        $expanded = ' expanded="' . $expanded .'"';
        $spanOnclick = 'onclick="Codnitive.expandMenu(this.parentNode)';
        $spanClass   = $config->getCollapsibleIconType() . '-' . $collapsibleIconPosition;
        $arrow = '<span class="' . $spanClass . ' " ' . $spanOnclick . '" style="width: ' . $width . 'px; height: ' . $height . 'px;' . $extraStyle . '"></span>';
    }

如果我添加此代码以扩展所需的类别

        if ($category->getId() == '35') {
        $expanded = 1;
    }

出现两个问题：

即使其他类别处于有效状态，该类别仍会展开。
“加号”符号（显示类别可以展开）仍然存在，但应该是“减号”。我想$ collapsibleIconPosition应该是'正确的'？
```
        if ($height == 0 && $collapsibleIconPosition === 'left') {
        $liMarginLeft += $width;
    }
```

Answer 1

你希望在加载HTML之后的任何时候执行该javascript。

如果您的网站使用jQuery，您可以将其置于准备好的回调中：

$(function(){
    Codnitive.expand(document.getElementById('the-menu-parent-element-id'))
})

您可以将它放在html文档的最后，或者至少在所有导航HTML代码之后。

...
  <script type="text/javascript" language="javascript">
    Codnitive.expand(document.getElementById('the-menu-parent-element-id'))
  </script>
</body>

或者您可以将其置于onload回调中。（警告：这可能会影响您网站上的其他JavaScript ）如果存在window.onload，则可以安全地在其开头或结尾添加那个功能。

window.onload = function(){
  Codnitive.expand(document.getElementById('the-menu-parent-element-id'))
}

您要定位的元素是：<ul class="level0 collapsible" ...

目前没有id，因此您无法直接使用getElementById()。

一个解决方案（不是我最喜欢的方法）是添加id

<ul id="start-open" class="level0 collapsible" ...

然后扩展它：

Codnitive.expand(document.getElementById('start-open'))

我认为最佳解决方案将修改HTML以执行expand对其执行的操作：

<li class="level0 nav-1 first parent collapsible" style="margin-left: 0px;">
<span class="plus-right " onclick="Codnitive.expandMenu(this.parentNode)" style="width: 16px; height: 16px;background-position: right center"></span>

<a class="collapsible-wrapper collapse-name" onclick="Codnitive.expandMenu(this.parentNode);return false;" href="#"><span class="category_name">WANT TO BE EXPANDED BY DEFAULT</span></a>

        <ul class="level0 collapsible" style="margin-left: 5px; padding-left: 10px;display: block" expanded="1">

<span class="plus-right"...获取style="...;background-position: right center"。

<ul class="level0"...获取expanded="1"和style="...;display:block"

如果这对您不起作用，那么查看代码的实时版本会非常有帮助。（缺乏JS和CSS的小提琴是不够的）

Answer 2

试试这个，虽然我不确定它设置为阻止哪个家长。我认为它是a标签上方的第一个<li>标签，因为span标签不是父母

$( document ).ready(function() {
  $('.nav-1').css( "display", "block" );
});

看看你是否想要它http://jsfiddle.net/6VSUm/

默认情况下扩展导航

2 个答案: