用到这个可以无限下拉/滚动加载插件Infinite Scroll
以搜索结果页商品列表为例
includes/templates/你的模板/templates/tpl_advanced_search_result_default.php
<?php
/**
* Page Template
*
* Loaded automatically by index.php?main_page=advanced_search_result.<br />
* Displays results of advanced search
*
* @package templateSystem
* @copyright Copyright 2003-2005 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: tpl_advanced_search_result_default.php 4182 2006-08-21 02:11:37Z ajeh $
*/
?>
<div class="centerColumn" id="advSearchResultsDefault">
<h1 id="advSearchResultsDefaultHeading"><?php echo HEADING_TITLE; ?></h1>
<?php
if (false) {
// $form = zen_draw_form('filter', zen_href_link(FILENAME_ADVANCED_SEARCH_RESULT), 'get') . '<label class="inputLabel">' .TEXT_SHOW . '</label>';
$form = zen_draw_form('filter', zen_href_link(FILENAME_ADVANCED_SEARCH_RESULT), 'get');
?>
<?php echo $form; ?>
<?php
echo zen_hide_session_id();
/* Re-Get all GET'ed variables */
$hidden_get_variables = '';
reset($_GET);
while (list($key, $value) = each($_GET)) {
if ( ($key != 'currency') && ($key != zen_session_name()) && ($key != 'x') && ($key != 'y') ) {
$hidden_get_variables .= zen_draw_hidden_field($key, $value);
}
}
echo $hidden_get_variables;
require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_PRODUCT_LISTING_ALPHA_SORTER));
?>
</form>
<?php
}
?>
<?php
/**
* Used to collate and display products from advanced search results
*/
require($template->get_template_dir('tpl_modules_product_listing.php', DIR_WS_TEMPLATE, $current_page_base,'templates'). '/' . 'tpl_modules_product_listing.php');
?>
<div class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_ADVANCED_SEARCH, zen_get_all_get_params(array('sort', 'page', 'x', 'y')), 'NONSSL', true, false) . '">' . zen_image_button(BUTTON_IMAGE_BACK, BUTTON_BACK_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
</div>
includes/templates/你的模板/templates/tpl_modules_product_listing.php
<?php
/**
* Module Template
*
* @package templateSystem
* @copyright Copyright 2003-2005 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: tpl_modules_product_listing.php 3241 2006-03-22 04:27:27Z ajeh $
* UPDATED TO WORK WITH COLUMNAR PRODUCT LISTING 04/04/2006
* Modified for admin control of customer option by Glenn Herbert (gjh42) 2012-09-21 2012-11-17 grid sorter
*/
include(DIR_WS_MODULES . zen_get_module_directory(FILENAME_PRODUCT_LISTING));
?>
<div class="product_list">
<ul>
<?php
/**
* load the list_box_content template to display the products
*/
if ($product_listing_layout_style == 'columns') {
if (!defined('PRODUCT_LISTING_GRID_SORT')) define('PRODUCT_LISTING_GRID_SORT', 0);
if (PRODUCT_LISTING_GRID_SORT) {
echo "\n" . '<div id="gridSorter">' . PRODUCT_LISTING_GRID_SORT_TEXT . '<ul>';
for ($col=0;$col<sizeof($grid_sort);$col++) {
if ($grid_sort[$col]['text']) echo '<li class="item">' . $grid_sort[$col]['text'] . '</li>';
}
echo '</ul></div>' . "\n";
}
require($template->get_template_dir('tpl_columnar_list_display.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_columnar_list_display.php');
} else {// (PRODUCT_LISTING_LAYOUT_STYLE == 'rows')
require($template->get_template_dir('tpl_tabular_display.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_tabular_display.php');
}
?>
<?php
// only show when there is something to submit and enabled
if ($show_bottom_submit_button == true) {
?>
<div class="buttonRow forward"><?php echo zen_image_submit(BUTTON_IMAGE_ADD_PRODUCTS_TO_CART, BUTTON_ADD_PRODUCTS_TO_CART_ALT, 'id="submit2" name="submit1"'); ?></div>
<?php
} // show_bottom_submit_button
?>
</ul>
</div>
<div class="scroller-status">
<div id="infscr-loading" class="loader-ellips infinite-scroll-request">
<img alt="Loading..." src="<?php echo $template->get_template_dir('waterfall_loading.png',DIR_WS_TEMPLATE, $current_page_base,'images'). '/waterfall_loading.png';?>">
<div><em>More Items Are Being Loaded. Please Wait.</em></div>
</div>
<p class="scroller-status__message infinite-scroll-last">End of content</p>
<p class="scroller-status__message infinite-scroll-error">No more pages to load</p>
</div>
<div class="navigation">
<a class="pagination__next" href="index.php?main_page=advanced_search_result&search_in_description=<?php echo $_GET['search_in_description']; ?>&keyword=<?php echo $_GET['keyword']; ?>&inc_subcat=<?php echo $_GET['inc_subcat']; ?>&sort=<?php echo $_GET['sort']; ?>&page=2" rel="nofollow"></a>
</div>
<?php
// if ($show_top_submit_button == true or $show_bottom_submit_button == true or (PRODUCT_LISTING_MULTIPLE_ADD_TO_CART != 0 and $show_submit == true and $listing_split->number_of_rows > 0)) {
if ($show_top_submit_button == true or $show_bottom_submit_button == true) {
?>
</form>
<?php } ?>
<script type="text/javascript">
$(function () {
$('.product_list ul').infiniteScroll({
path: '.pagination__next',
append: '.product_list li',
hideNav: '.navigation',
status: '.scroller-status',
});
})
</script>
商品列表横排显示
includes/modules/你的模板/product_listing.php:
<?php
/**
* product_listing module
*
* @package modules
* @copyright Copyright 2003-2010 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: product_listing.php 17051 2010-07-29 07:25:09Z drbyte $
*/
if (!defined('IS_ADMIN_FLAG')) {
die('Illegal Access');
}
$listing_split = new splitPageResults($listing_sql, 10, 'p.products_id', 'page');
$zco_notifier->notify('NOTIFY_MODULE_PRODUCT_LISTING_RESULTCOUNT', $listing_split->number_of_rows);
$listing = $db->Execute($listing_split->sql_query);
$row = 0;
$col = 0;
$list_box_contents = array();
$title = '';
// 列数
$columns = 4;
// 横排样式
$product_listing_layout_style = 'columns';
$num_products_count = $listing->RecordCount();
// show only when 1 or more
if ($num_products_count > 0) {
if ($num_products_count < $columns ) {
$col_width = round(100/$num_products_count, 2);
} else {
$col_width = round(100/$columns, 2);
}
while (!$listing->EOF) {
$products_price = zen_get_products_display_price($listing->fields['products_id']);
$products_price = str_replace('</span> <span', '</span><span', $products_price);
$products_price = str_replace('Save: ', '', $products_price);
if (!isset($productsInCategory[$listing->fields['products_id']])) $productsInCategory[$listing->fields['products_id']] = zen_get_generated_category_path_rev($listing->fields['master_categories_id']);
$list_box_contents[$row][$col] = array('params' => '',
'text' => (($listing->fields['products_image'] == '' and PRODUCTS_IMAGE_NO_IMAGE_STATUS == 0) ? '' : '<a class="product" href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . $productsInCategory[$listing->fields['products_id']] . '&products_id=' . $listing->fields['products_id']) . '">' . zen_image2(DIR_WS_IMAGES . $listing->fields['products_image'], $listing->fields['products_name'], '', '', 'class="item_thumb_img_big img-lazyload"') . '<i></i></a>') . '<div class="item">' . $products_price . '</div>');
$col ++;
if ($col > $columns - 1) {
$col = 0;
$row ++;
}
$listing->MoveNext();
}
}
效果图:
参考:
https://infinite-scroll.com/demo/full-page