Wordpress WooCommerce网格/列表切换:如何触发按钮点击

Wordpress WooCommerce Grid / List toggle: How to trigger a button click?

本文关键字：何触发 按钮 网格 WooCommerce 列表 Wordpress      更新时间：2023-09-26

"WooCommerce网格/列表切换"-插件切换WooCommCommerce中产品列表的视图。最后一个选择存储在cookie中。

HTML页面包含：

<nav class="gridlist-toggle">
  <a href="#" id="grid" title="gridview">&#8862; <span>gridview</span></a>
  <a href="#" id="list" title="listview">&#8863; <span>listview</span></a>
</nav>
<ul class="products">
  <li class=" ...

Javascript函数是：

jQuery(document).ready(function(){
    jQuery('#grid').click(function() {
        jQuery(this).addClass('active');
        jQuery('#list').removeClass('active');
        jQuery.cookie('gridcookie','grid', { path: '/' });
        jQuery('ul.products').fadeOut(300, function() {
            jQuery(this).addClass('grid').removeClass('list').fadeIn(300);
        });
        return false;
    });
    jQuery('#list').click(function() {
        jQuery(this).addClass('active');
        jQuery('#grid').removeClass('active');
        jQuery.cookie('gridcookie','list', { path: '/' });
        jQuery('ul.products').fadeOut(300, function() {
            jQuery(this).removeClass('grid').addClass('list').fadeIn(300);
        });
        return false;
    });
    if (jQuery.cookie('gridcookie')) {
        jQuery('ul.products, #gridlist-toggle').addClass(jQuery.cookie('gridcookie'));
    }
    if (jQuery.cookie('gridcookie') == 'grid') {
        jQuery('.gridlist-toggle #grid').addClass('active');
        jQuery('.gridlist-toggle #list').removeClass('active');
    }
    if (jQuery.cookie('gridcookie') == 'list') {
        jQuery('.gridlist-toggle #list').addClass('active');
        jQuery('.gridlist-toggle #grid').removeClass('active');
    }
    jQuery('#gridlist-toggle a').click(function(event) {
        event.preventDefault();
    });
});

如何始终在主商店页面上获得列表视图，并始终在类别页面上获得网格视图，而不考虑用户的选择？

使用WordPress条件标签。

使用Php将cookie设置为默认值。类似。。。

<?php if (is_page(id)) { 
        $defaultView = 'list';
     } 
      else {
        $defaultView = 'grid'; 
     }
        setcookie("gridcookie", $defaultView);
      ?>

将id替换为商店主页面的页面id。或者使用其他选项之一http://codex.wordpress.org/Function_Reference/is_page

相关文章：