0

次のような Javascript 配列があります。

var fruits=['apple','orange','peach','strawberry','mango']

そして、これらの要素にイベントを追加して、データベースにさまざまなものを追加したいと考えています。たとえば、「リンゴ」は私に与えます

<div class="apple">golden</div>
<div class="apple">granny</div>
<div class="apple">canada</div>

さらに、マンゴーの品種に関するデータベースには何もありません。残りの配列から「マンゴー」を強調したいと思います。私はすでに次のようなクラスを作成しています:

.black {
    color: black;
    pointer-events: none;
    cursor: default;
}

.couleur {
    color: blue;
}

HTML コードを追加する必要がありますか? ご協力ありがとうございます。これは、stackoverflow に関する私の 2 回目の投稿に過ぎないため、変なコード サンプルで申し訳ありません。

4

1 に答える 1

0

OK、これは 2 回目の投稿なので、Web 開発に比較的慣れていないことを前提としています。いらっしゃいませ！

あなたの質問は、あなたが何をしたいのかについてあまり明確ではないので、最初に単純であると仮定します.phpスクリプトへのAJAX呼び出しを行うonclickイベントを作成します(あなたはphpにタグを付けたので、私はあなたを仮定します. php スクリプトを書き直す) し、ページの動的 div に結果を表示します。

別のスタイルの php スクリプトを使用するので、怖がらないでください。

if ($something):
    // do something
else:
    // do something else
endif;

まず、要素を設定しましょう。

<?php
// Assume we already have the fruit categories stored in an array, $categories
// Display each fruit category on the page
foreach ($categories as $category) :
?>
    <div class='category' id='<?=$category?>'><?=$category?></div>

<?php
endforeach;
?>
<!-- empty placeholder div - this is where our results will go -->
<div id='results'></div>

これにより、ページで開始するすべての要素が表示されます。カテゴリクラスに基づいてこれらの要素のスタイルを設定する場合は、すぐに行ってください。

次に、onClick の動作を決定する JavaScript を記述する必要があります。これには、そのままの JavaScript を使用することも、jQuery を使用することもできます (これは今日非常に普及しています。よく読んでください。把握するのはそれほど難しくありません)。

<script type='text/javascript' language='javascript'>
    $('.category').click(function() {
        // grab the category (based on the id of the element) and send it to our background page
        var category = $(this).id();
        $.post('backgroundScript.php', 
            {
                type: category
            }, 
            function(data) {
                // print the results inside the #results div
                $('#results').html(data);
            }
        );
    });        
</script>

最後に、データを処理して結果を返すバックグラウンド スクリプトが必要です。

<?php
//backgroundScript.php

$type = $_POST['type'];

// pass $type in to the database and perform some joins to get the subcategories in an array,
// then present a list of subcategories
$subcategories = findSubCategoriesInDB($type);

if (count($subcategories)) {
    echo "<ul>";
    foreach ($subcategories as $subcat) {
        echo "<li>" . $subcat . "</li>";
    }
    echo "</ul>";
} else {
    echo "No subcategories were found for " . $type;
}
于 2012-07-25T13:48:05.380 に答える