0

我正在为产品开发一个类别。我想要实现的只是单击一个类别，然后这个当前类别背景会改变。它就像普通类别一样简单。但是，我正在努力实现它。谁能帮我解决这个棘手的问题？

下面是生成类别的代码

 while ( $cat = mysql_fetch_assoc( $res ) ) 
    { 
        $cats[] = $cat; 
    } 

} 


$list_items = array(); 

foreach ( $cats as $cat ) 
{ 


    if ( ( int ) $cat['parent'] !== ( int ) $parent ) 
    { 
        continue; 
    } 

    $current = $cat['categoryID'];
    $list_items[] = '<nav><li class ="heading">'; 

    $list_items[] = '<a href="javascript:void(0)" id ='. $cat['categoryID'].' onClick="getPage('. $cat['categoryID'] . ','.$cat['parent'].')">';
    $list_items[] = $cat['name'];
    $list_items[] = '</a></li>'; 
    $list_items[] = '<ul class ="content">'; 
    $list_items[] = category_list( $cat['categoryID'] ); 
    $list_items[] = '</ul>';

    $list_items[] = '</nav>'; 



    $list_items[] = ''; 

} 


$list_items = implode( '', $list_items ); 


if ( '' == trim( $list_items ) ) 
{ 
    return ''; 
} 


return '<div><ul>' . $list_items . '</ul></div>';

我目前对此的查询如下：

jQuery(document).ready(function() {
jQuery(".content").hide();

jQuery(".heading").click(function()
{
jQuery(this).next(".content").slideToggle(500,function(){
$(this).parent().find('li.heading').css('background-color','green');
$(this).find('.heading').css('background-color','red');
});
});
});

HTML：

<div class="catbottom">
            <?php include("category.php");echo category_list();?>
        </div>

非常感谢。

过程如下：

在 html 中，我包含用于生成类别的 category.php。
对于每个类别，当用户单击类别列表时，相应的项目将显示在一个名为“容器”的 div 中

4

1 回答 1

3

我认为这应该完成你所需要的。

$(document).on('click', '.heading', function() {
    $(this).toggleClass("active");
    $(this).next("ul.content").slideToggle();
});

我给了你的 CSS 一个名为“active”的类，另外，我根据这个 HTML 给出了这个答案（都是最好的猜测）：

<nav>
    <ul>
    <li class ="heading">
        <a href="#">rando link</a>
    </li>
        <ul class ="content" style="display: none;">
            <li>blah</li>
        </ul>
    </ul>
</nav>

还有一个检查它的小提琴：http: //jsfiddle.net/h2ufk/

于 2013-05-03T12:55:15.123 回答