1

これは簡単かもしれませんが、私には理解できません。

json 配列に変換する PHP 配列があり、jquesry を使用して json 配列を投稿し、html div を ul として投稿する必要があります。

    <?php
// Create a Catalog
$catalog = array(
    'categories' => array(
        array(
            'name'          => 'Category 1',
            'categories'    => array(
                array(
                    'name'          => 'Category 1 Sub 1',
                    'products'      => array()
                ),
                array(
                    'name'          => 'Category 1 Sub 2',
                    'categories'    => array(
                        array(
                            'name'      => 'Category 1 Sub 2 Sub 1',
                            'products'  => array()
                        ),
                        array(
                            'name'      => 'Category 1 Sub 2 Sub 2',
                            'products'  => array()
                        ),
                        array(
                            'name'      => 'Category 1 Sub 2 Sub 3',
                            'products'  => array()
                        ),
                    )
                ),
                array(
                    'name'          => 'Category 1 Sub 3',
                    'products'      => array()
                ),
            )
        ),
        array(
            'name'          => 'Category 2',
            'products'      => array()
        ),
        array(
            'name'          => 'Category 3',
            'categories'    => array(
                array(
                    'name'      => 'Category 3 Sub 1',
                    'products'  => array()
                ),
                array(
                    'name'      => 'Category 3 Sub 2',
                    'products'  => array()
                ),
                array(
                    'name'      => 'Category 3 Sub 3',
                    'products'  => array()
                ),
            )
        ),
    ),
);

echo json_encode($catalog);?>

json 配列を #categories 内の html ul に投稿する必要があります

    <html>
<head>
    <title>Testing</title>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>

</head>
<body>
    <h1>Catalog</h1>
    <ul id="categories">
        <li>No Categories</li>
    </ul>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="js/script.js"></script>
</body>

これが私のjqueryの始まりです

    $.ajax({
url : '/catalog.php',
dataType : 'json',
success : function(data) {
    $('#categories li').remove();
    $('#categories').append('<li>' + data.categories[0].name + '</li>');
    $('#categories').append('<li>' + data.categories[1].name + '</li>');
    $('#categories').append('<li>' + data.categories[2].name + '</li>');
}

});

私は配列をulに投稿するのに行き詰まっており、ここからどこへ行くべきか本当にわかりません。どんな助けでも大歓迎です。ありがとうございました。

4

1 に答える 1

0

まあ、あなたは正しい方向にいますが、再帰関数を使用してすべてを動的に取得します。

<script type="text/javascript">

function generate_subcategories(categories)
{
    var ul_html_data = '<ul>';

    for (var i = 0; i < categories.length; i++)
    {
        ul_html_data += '<li>' + categories[i].name + '</li>';

        if (categories[i].categories)
        {
            ul_html_data += generate_subcategories(categories[i].categories);
        }

    }

    ul_html_data += '</ul>';

    return ul_html_data;
}

$.ajax(
    {
        url : 'catalog.php',
        dataType : 'json',
        success : function(data)
        {
            var list_html_data = '';

            for (var i = 0; i < data.categories.length; i++)
            {
                list_html_data += '<li>' + data.categories[i].name + '</li>';

                if (data.categories[i].categories)
                {
                    list_html_data += generate_subcategories(data.categories[i].categories);
                }
            }

            $('#categories').html(list_html_data);
        }
    }
);
</script>
于 2013-09-13T01:22:23.977 に答える