Bezüglich des Delegiertenproblems von jq

<code>//PHP
<?php
include "db.php";
if(isset($_POST["category"])){


    $category_query = "SELECT * FROM categories";


    $run_query = mysqli_query($con,$category_query); 
    echo "
<div class='nav nav-pills nav-stacked'>
    <li class='active'><a href='#'><h4>Categories</h4></a></li>
    ";

    if(mysqli_num_rows($run_query)>0){
        
        while($row = mysqli_fetch_array($run_query)){
            $cid = $row["cat_id"];
            $cat_name = $row["cat_title"];

//问题在这里
            echo "
<li><a href='#' class='category' cid='$cid'>$cat_name</a></li>
            ";
        }
        echo "</div>";
    }
}


if(isset($_POST["brand"])){
    $brand_query = "SELECT * FROM brands";
    $run_query = mysqli_query($con,$brand_query);
    echo "
<div class='nav nav-pills nav-stacked'>
    <li class='active'><a href='#'><h4>Brands</h4></a></li>
    ";

    if(mysqli_num_rows($run_query)>0){
        while($row = mysqli_fetch_array($run_query)){
            $bid = $row["brand_id"];
            $brand_name = $row["brand_title"];
            echo "
<li><a href='#'>$brand_name</a></li>
            ";
        }
        echo "</div>";
    }
}

if(isset($_POST["getProduct"])){
    $product_query =  "SELECT * FROM products ORDER BY RAND() LIMIT 0,9";
    $run_query = mysqli_query($con,$product_query);
    if(mysqli_num_rows($run_query) >0 ){
        while($row = mysqli_fetch_array($run_query)){
           $pro_id = $row['product_id'];
           $pro_cat = $row['product_cat'];
           $pro_brand = $row['product_brand'];
           $pro_title = $row['product_title'];
           $pro_price = $row['product_price'];
           $pro_image = $row['product_image'];
           echo "
             <div class='col-md-4'>
                        <div class='panel panel-info'>
                            <div class='panel-heading'>$pro_title</div>
                            <div class='panel-body'>
                                <img style='width:300px;height:300px' src='product_image/$pro_image' />
                            </div>
                            <div class='panel-heading'>$.$pro_price.00
                              <button pid='$pro_id' style='float:right' class='btn btn-danger btn-xs'>AddToCart</button>
                            </div>
                        </div>
                        </div>
           ";
        }
    }

}


?></code>

<code>//JS

 $(document).ready(function() {
    cat();
    brand();
    product();

    function cat() {
        $.ajax({
                url: 'action.php',
                type: 'POST',
                data: {
                    category: 1
                },
            })
            .done(function(data) {
                //console.log(data);
                $("#get_category").html(data);

            });


    }

    function brand() {
        $.ajax({
                url: 'action.php',
                type: 'POST',
                data: {
                    brand: 1
                },
            })
            .done(function(data) {
                //console.log(data);

                $("#get_brand").html(data);

            });


    }


    function product() {
        $.ajax({
                url: 'action.php',
                type: 'POST',
                data: {
                    getProduct: 1
                },
            })
            .done(function(data) {
                //console.log(data);
                $("#get_product").html(data);

            });
    }

    //使用 delegate() 方法。on不能获取
    $("body").delegate(".category", "click", function() {
        alert(123);
    })
    // $(".category").on("click", function(event) {
    //     alert(13);
    // });
})</code>

Warum erfolgt keine Reaktion, wenn ich auf die Ein-Methode klicke? Aber der Delegierte tut es? Liegt es daran, dass diese Klasse in PHP geschrieben ist und von on nicht gelesen werden kann? Oder was?

Antwortinhalt:

<code>//PHP
<?php
include "db.php";
if(isset($_POST["category"])){


    $category_query = "SELECT * FROM categories";


    $run_query = mysqli_query($con,$category_query); 
    echo "
<div class='nav nav-pills nav-stacked'>
    <li class='active'><a href='#'><h4>Categories</h4></a></li>
    ";

    if(mysqli_num_rows($run_query)>0){
        
        while($row = mysqli_fetch_array($run_query)){
            $cid = $row["cat_id"];
            $cat_name = $row["cat_title"];

//问题在这里
            echo "
<li><a href='#' class='category' cid='$cid'>$cat_name</a></li>
            ";
        }
        echo "</div>";
    }
}


if(isset($_POST["brand"])){
    $brand_query = "SELECT * FROM brands";
    $run_query = mysqli_query($con,$brand_query);
    echo "
<div class='nav nav-pills nav-stacked'>
    <li class='active'><a href='#'><h4>Brands</h4></a></li>
    ";

    if(mysqli_num_rows($run_query)>0){
        while($row = mysqli_fetch_array($run_query)){
            $bid = $row["brand_id"];
            $brand_name = $row["brand_title"];
            echo "
<li><a href='#'>$brand_name</a></li>
            ";
        }
        echo "</div>";
    }
}

if(isset($_POST["getProduct"])){
    $product_query =  "SELECT * FROM products ORDER BY RAND() LIMIT 0,9";
    $run_query = mysqli_query($con,$product_query);
    if(mysqli_num_rows($run_query) >0 ){
        while($row = mysqli_fetch_array($run_query)){
           $pro_id = $row['product_id'];
           $pro_cat = $row['product_cat'];
           $pro_brand = $row['product_brand'];
           $pro_title = $row['product_title'];
           $pro_price = $row['product_price'];
           $pro_image = $row['product_image'];
           echo "
             <div class='col-md-4'>
                        <div class='panel panel-info'>
                            <div class='panel-heading'>$pro_title</div>
                            <div class='panel-body'>
                                <img style='width:300px;height:300px' src='product_image/$pro_image' />
                            </div>
                            <div class='panel-heading'>$.$pro_price.00
                              <button pid='$pro_id' style='float:right' class='btn btn-danger btn-xs'>AddToCart</button>
                            </div>
                        </div>
                        </div>
           ";
        }
    }

}


?></code>

<code>//JS

 $(document).ready(function() {
    cat();
    brand();
    product();

    function cat() {
        $.ajax({
                url: 'action.php',
                type: 'POST',
                data: {
                    category: 1
                },
            })
            .done(function(data) {
                //console.log(data);
                $("#get_category").html(data);

            });


    }

    function brand() {
        $.ajax({
                url: 'action.php',
                type: 'POST',
                data: {
                    brand: 1
                },
            })
            .done(function(data) {
                //console.log(data);

                $("#get_brand").html(data);

            });


    }


    function product() {
        $.ajax({
                url: 'action.php',
                type: 'POST',
                data: {
                    getProduct: 1
                },
            })
            .done(function(data) {
                //console.log(data);
                $("#get_product").html(data);

            });
    }

    //使用 delegate() 方法。on不能获取
    $("body").delegate(".category", "click", function() {
        alert(123);
    })
    // $(".category").on("click", function(event) {
    //     alert(13);
    // });
})</code>

Warum erfolgt keine Reaktion, wenn ich auf die Ein-Methode klicke? Aber der Delegierte tut es? Liegt es daran, dass diese Klasse in PHP geschrieben ist und von on nicht gelesen werden kann? Oder was?

Verwenden Sie on

für dynamisch generierte Elemente

<code> $('body').on('click','.category' , function() {
         alert(123);
     })</code>

Bevor Sie eine neue API verwenden, sollten Sie deren Funktion anhand der Dokumentation vollständig verstehen.