Question

我正在修改购物车的后端。我需要在可折叠的嵌套列表中列出产品类别。我已经能够用Jochen的代码做到这一点：

$(function() {
  $('li > ul').each(function(i) {
    var parent_li = $(this).parent('li');
    parent_li.addClass('folder');
    var sub_ul = $(this).detach();
    parent_li.find('a').click(function() {
      sub_ul.toggle();
    });
    parent_li.append(sub_ul);
  });
  $('ul ul').hide();
});

但是，当点击该类别时，我还需要能够显示给定类别中的所有产品。我希望事件使页面在该点执行mysql调用，然后在可折叠树右侧的div中列出产品。

我是自学成才，虽然我已经非常擅长php了，但是我已经用了几年的时间做了很多普通的旧javascript，而且我担心我会用ajax和jQuery来解决这个问题。。任何帮助将不胜感激。

我试图实现vinceh提出的非常受欢迎的解决方案，但是尽管经过了几天的研究，我仍然无法弄清楚如何使用.data对象将类别传递给url。

任何人对如何传递我需要的数据都有任何想法？

提前致谢。

Answer 1

我会向您的类别项添加一个click事件，并发送一个AJAX请求，该请求将从数据库中检索必要的项目并将其发送回要呈现的页面。您可以通过以下方式进行绑定：

$(".someClass").click( function() {
    $.ajax({
        url: "url/to/your/function",
        type: "GET",
        dataType: "script"
    });
});

但问题是，你需要通过url传递类别项，你可以通过JQuery将.data添加到对象中来实现。

一旦服务器返回信息，你将呈现一些东西，这取决于你的框架如何做，你有不同的解决方案，但它只是一个简单的渲染动作，如.append所有你的项目你想要的div。

您可以为AJAX请求添加许多选项，使其完全符合您的要求，有关详细信息，请参阅this。祝你好运！

如何将多个事件添加到可折叠列表？

1 个答案: