【问题标题】:Make Magento 1.9 product filter collapsible使 Magento 1.9 产品过滤器可折叠
【发布时间】:2015-11-05 13:46:31
【问题描述】:

我正在尝试使 magento 商店的产品过滤器可折叠。我尝试在 template/category/layer/view.phtml 中编辑 view.phtml 但它不起作用。

我编辑了这些行:<dt><?php echo $this->__($_filter->getName()) ?></dt>

<dt><a href="/"><?php echo $this->__($_filter->getName()) ?></a></dt>

我添加了一些这样的 jquery:

<script type="text/javascript">
    /* <![CDATA[ */
    jQuery(document).ready(function(){
        jQuery("dl#narrow-by-list> dd:not(:first)").hide();
        jQuery("dl#narrow-by-list> dt a").click(function(){
            jQuery("dl#narrow-by-list> dd:visible").slideUp("fast");
            jQuery(this).parent().next().slideDown("fast");
            return false;
        });
    });
    /* ]]> */
</script> 

当前代码:

?>
<?php  if($this->canShowBlock()): ?>
<div class="block block-layered-nav">
    <div class="block-title">
        <strong><span><?php  echo $this->__('Shop By')  ?></span></strong>
    </div>
    <div class="block-content">
        <?php  echo $this->getStateHtml()  ?>
        <?php  if ($this->getLayer()->getState()->getFilters()): ?>
            <div class="actions"><a href="<?php  echo $this->getClearUrl()  ?>"><?php  echo $this->__('Clear All')  ?></a></div>
        <?php  endif; ?>
        <?php  if($this->canShowOptions()): ?>
            <p class="block-subtitle"><?php  echo $this->__('Shopping Options')  ?></p>
            <dl id="narrow-by-list">
                <?php  $_filters = $this->getFilters()  ?>
                <?php  foreach ($_filters as $_filter): ?>
                <?php  if($_filter->getItemsCount()): ?>
                    <div class="<?php  if(strcasecmp($_filter->getName(), 'PRICE') == 0) echo 'layered-price'; else echo 'layered-attribute'; ?>">
                        <div class="title-layered"><dt><a href="/"><?php  echo $this->__($_filter->getName())  ?></a></dt></div>
                        <dd><?php  echo $_filter->getHtml()  ?></dd>
                    </div>
                <?php  endif; ?>
                <?php  endforeach; ?>
            </dl>
            <script type="text/javascript">decorateDataList('narrow-by-list')</script>
        <?php  endif; ?>
    </div>
</div>
<?php  endif; ?>
<script type="text/javascript">
    /* <![CDATA[ */
    jQuery(document).ready(function(){
        jQuery("#narrow-by-list> dd:not(:first)").hide();
        jQuery("#narrow-by-list> dt a").click(function(){
            jQuery("#narrow-by-list> dd:visible").slideUp("fast");
            jQuery(this).parent().next().slideDown("fast");
            return false;
        });
    });
    /* ]]> */
</script>

有人知道为什么这不起作用吗?

【问题讨论】:

    标签: javascript php jquery magento magento-1.9


    【解决方案1】:

    你在链接标签上做了一个点击事件

    你可以用这个 href 属性来欺骗你的 javascript:

    <dt><a href="javascript:void(0)"> <?php echo $this->__($_filter->getName()) ?></a></dt>
    

    然后你的jquery点击功能将照常触发。

    【讨论】:

    • 成功了,我将 jquery 更新为:'(function($) { $(document).ready(function() { $("#narrow-by-list dd"). hide(); $(".layered-nav dt a").bind("click", function() { $(this).parent().next().slideToggle(); return false; }) }) ; })(jQuery);'我现在只有在屏幕具有一定宽度时才执行此操作,以便菜单项仅在移动设备上折叠,知道该怎么做吗?
    • 如果您遇到新问题和新问题,最好的做法是在另一个帖子上再次提问并验证当前帖子。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-09-19
    相关资源
    最近更新 更多