1

我是 jquery 的新手，想制作一个滑动表。orinal 表有 3 个级别：

<ul class="categories">
<li id="category1">1 element</li>  //parentid=0
<li id="category2">2 element</li>  //parentid=0
<ul>
<li id="category3">1 element of element id2</li>  //parentid=2
<ul>
<li id="category4">1 element id3</li>  //parentid=3
</ul>
</li>
</ul>
</li>
</ul>

第一级元素有parentid = 0，id=1++，下一级有嵌套的parentid，并且有自己的id等等。

页面加载只有 1 级， parentid = 0。

<ul class="categories">
<li id="category1">1 element</li>  //parentid=0
<li id="category2">2 element</li>  //parentid=0
</ul>

然后我要点击 li，取 id ID - go to file，执行 mysql，获取变量中的新表，将其带回并在 LI 下滑动切换。

php端

if(isset($_POST['subcategory'])){
    $subcategory = str_replace('category', '', $_POST['subcategory']);  
    echo build_category_tree($subcategory); // builds the UL tree
}

这会返回我的 ID，我需要返回列表并切换它。

现在新的 UL 已连接，但我的 jquery 无法使用它，用下面的脚本更新了脚本，但仍然不能。

更新的jQuery

    $(".tablecategoryname").on('click', function(){
    var $a = $(this).closest('li').attr('id');
    var $c = $(this).closest('li');

    $.ajax({
       type: "POST",
       url: "functions.php",
       data: {subcategory:$a},
       cache: false,
       success: function(data)
       {
            $(data).hide().insertAfter($c).slideDown(400);
       }
     });    
});
4

2 回答 2

0

ID 不应仅包含数字（或以数字开头），您可能应该使用#a1或类似的东西。在 data 参数中，您正在发送一个对象，而等号并没有真正起作用。

$(".table li").on('click', function(){
    var self = this;
    $.ajax({
       type: "POST",
       url: "functions.php",
       data: {id : self.id},
       cache: false
    }).done(function(data) {
        //guessing you're returning valid HTML
        $(data).hide().insertAfter(self).slideDown(400);
    });
});

编辑：

您的 build_category_tree() 函数需要返回 HTML，以便您可以将其回显到 ajax 请求：

if(isset($_POST['subcategory'])){
    echo $subcategory = str_replace('category', '', $_POST['subcategory']); 
    $ULtree = build_category_tree($subcategory); // builds the UL tree
    echo $ULtree; //echo back to Ajax
}
于 2013-02-15T13:58:45.657 回答
0

你应该在你的主 ul 中放一个 id 来捕捉他的父母，然后他们在主 ul 中切换列表。

$("ul.umenu > li).click(function (e) {

    e.preventDefault();

    var element = $(this);

    if (element.parent().find("ul").is(":visible")) {
    } else {

        $("ul.umain> li > ul").slideUp();

        element.parent().find("ul").slideToggle("fast");

    }

});
于 2013-02-15T14:09:23.917 回答