//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'>
@@##@@
</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>
";
}
}
}
?>//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);
// });
})我用on的方法为什么点击没反应？而delegate却有？是不是因为这个class写在php上，on不能读取？还是怎么样？
回复内容：
//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'>
@@##@@
</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>
";
}
}
}
?>//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);
// });
})我用on的方法为什么点击没反应？而delegate却有？是不是因为这个class写在php上，on不能读取？还是怎么样？
对于动态生成的元素使用on
$('body').on('click','.category' , function() {
alert(123);
})
在你用一个新 API 之前，应通过文档充分了解它的作用。
