使用jQuery向上滑动并删除子菜单

时间:2013-04-02 17:44:39

标签: jquery submenu

这是有问题的代码:

            $('a.delete').click(function(e) {

            e.preventDefault();
            var parent = $(this).parent();

            $.ajax({
                type: 'get',
                url: 'deletemenu.php',
                data: 'ajax=1&delete=' + parent.attr('id').replace('menu-',''),
                beforeSend: function() {
                parent.animate({'backgroundColor':'#fb6c6c'},300);
            },
                    success: function() {

                    parent.slideUp(300,function() {
                        parent.remove();
                    });

                    $('.menusub').slideUp(300,function() {
                        $('.menusub').remove();
                    });
                }
            });
        });

好的,我想要做的是slideUp并删除特定菜单下的所有子菜单(删除此菜单时)。现在我有$('.menusub').slideUp(300,function() { $('.menusub').remove(); });。为达到这个。当然,这个代码的问题在于它将使所有子菜单(具有menusub类)消失。如何确保只有特定菜单下的子菜单会消失?

顺便说一句,这是查看菜单

的代码
            $result = mysql_query("SELECT * FROM Menu") or die(mysql_error());
        while($row = mysql_fetch_array($result)){
            echo '<div class="menu" id="menu-',$row['menu_id'],'">';
            echo $row['menu_name']. " - ". $row['menu_weight']. "<a class='delete' href='?delete=".$row['menu_id']."'> delete</a>";
            echo '</div>';

            $sub = mysql_query("SELECT * FROM SubMenu INNER JOIN Menu WHERE SubMenu.menu_id = Menu.menu_id AND Menu.Menu_id = ".$row['menu_id']."") or die(mysql_error());
            while($subrow = mysql_fetch_array($sub)){
                echo '<div class="menusub" id="menusub-',$subrow['submenu_id'],'">';
                echo "-- ".$subrow['submenu_name']." - ".$subrow['submenu_weight']."<a class='deletesub' href='?deletesub=".$subrow['submenu_id']."'> delete</a><br/>";
                echo '</div>';
            }
        }`

Tnx回复!

1 个答案:

答案 0 :(得分:0)

这可能会对您有所帮助:

更改:

$('#menusub-').slideUp(300,function() {
    $('.menusub').remove();
});

要:

var rowid = parent.attr('id').split('-')[1];
$('#menusub-'+rowid).slideUp(300,function() {
    $(this).remove();
});

修改 建议,在子菜单中添加属性rel,如下所示:

rel="$row['menu_id']"

并使您的脚本像:

$('a.delete').click(function(e) {

    e.preventDefault();
    var parent = $(this).parent();
    parent.slideUp(300,function() {
        parent.remove();
});

var id = parent.attr('id').split('-')[1];
$('div.submenu').each(function(index, element) {
    $this = $(this);
    if($this.attr('rel') == id) {
        $this.slideUp(300,function() {
            $this.remove();
        });
    }
    });

});