这是我在 OpenCart 中用来显示包含不同层级的分类菜单的代码。它能够正常工作，但每次点击后会产生越来越多的 XHR finished loading: POST 和 XHR finished loading: GET，有时会导致页面停止：
<script type="text/javascript">
_url = '';
$(document).ready(function(){
$('#mnav a').on('click', function() {
var cat = $(this).attr('id');
_url = '&category_id=' + cat;
$.post('index.php?route=test/category/child' + _url,
function(data) {
if(data.length>10){
$('#mnav #sub').remove();
$(data).insertAfter($('#mnav #' + cat));
}
});
});
});
$.ajaxPrefilter(function( options, original_Options, jqXHR ) {
options.async = true;
});
</script>
HTML代码：
<div id="mnav" class="list-group">
<?php foreach ($categories as $category) { ?>
<a id="<?php echo $category['category_id']; ?>" class="list-group-item active"><?php echo $category['name']; ?></a>
<?php } ?>
</div>
控制器代码：
<?php
class ControllerTestCategory extends Controller {
public function index() {
if (isset($this->request->get['path'])) {
$parts = explode('_', (string)$this->request->get['path']);
} else {
$parts = array();
}
$data['category_id'] = 0;
if (isset($parts[0])) {
$data['category_id'] = $parts[0];
} else {
$data['category_id'] = 0;
}
if (isset($parts[1])) {
$data['child_id'] = $parts[1];
} else {
$data['child_id'] = 0;
}
$this->load->model('catalog/cat');
$data['categories'] = array();
$categories = $this->model_catalog_cat->getCategories(0);
foreach ($categories as $category) {
$children_data = array();
$filter_data = array(
'filter_category_id' => $category['category_id'],
'filter_sub_category' => true
);
$data['categories'][] = array(
'category_id' => $category['category_id'],
'name' => $category['name'],
'children' => $category['children'],
'products' => $category['products'],
'href' => $this->url->link('product/category', 'path=' . $category['category_id'])
);
}
$this->response->setOutput($this->load->view('test/category', $data));
}
public function child() {
if (isset($this->request->get['category_id'])) {
$this->load->model('catalog/cat');
$data['categories'] = array();
$categories = $this->model_catalog_cat->getCategories($this->request->get['category_id']);
$data['x'] = '<div id="sub">';
foreach ($categories as $category) {
$data['x'] .= '<li>' . $category['name'] . '</li>';
}
$data['x'] .= '</div>';
} else {
$data['x'] = 'NA';
}
$this->response->setOutput($this->load->view('test/category', $data));
}
}
SQL代码:
public function getCategories($parent_id = 0) {
$sql = "SELECT c.category_id, c.parent_id, cd.name,
(SELECT COUNT(DISTINCT ch.category_id) from category ch where ch.parent_id = c.category_id and cd.language_id = '" . (int)$this->config->get('config_language_id') . "') as children";
$sql .= " , (SELECT COUNT(DISTINCT p.product_id)
FROM product p
LEFT JOIN product_description pd ON (p.product_id = pd.product_id)
LEFT JOIN product_to_category p2c ON (p2c.product_id = p.product_id)
LEFT JOIN category_path cp ON (cp.category_id = p2c.category_id)
WHERE
pd.language_id = '" . (int)$this->config->get('config_language_id') . "' AND
p.status = '1' AND
p.date_available <= NOW()) AS items";
$sql .= " FROM category c LEFT JOIN category_description cd ON (c.category_id = cd.category_id) WHERE c.parent_id = '" . (int)$parent_id . "' AND cd.language_id = '" . (int)$this->config->get('config_language_id') . "' AND c.status = '1' ORDER BY c.sort_order, LCASE(cd.name)";
$query = $this->db->query($sql);
return $query->rows;
}
如果您能提供所有必要的JavaScript、jQuery和JSON代码，我将非常感激，因为我对这些主题了解甚少 :-(