Question

在这段代码中我有$ product_list，它是通过执行下面给出的查询获得的，但是当我点击按钮link1时它使用ajax它必须清空$ product_list。

那么，当我点击products_list按钮时，如何使用ajax调用清空Link1上的内容？

在我看到的一些问题中，使用div id删除了内容。但在这里我不太确定，因为我有一个班级而且要被删除。

请帮助..

<?php
session_start(); //start session
include("config.inc.php"); //include config file
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Stores</title>
<link href="style/style1.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>

<div class="w3-bar w3-black">
  <a href="#" class="w3-bar-item w3-button">Link 1</a>
</div>

<div align="center">
<h3>Products</h3>
</div>
<?php
//List products from database
$results = $mysqli_conn->query("SELECT product_name, product_desc, product_code, product_image, product_price FROM products_list");
//Display fetched records as you please

$products_list =  '<ul class="products-wrp">';

while($row = $results->fetch_assoc()) {
$products_list .= <<<EOT
<li>
<form class="form-item">
<h4>{$row["product_name"]}</h4>
<div>
<img src="images/{$row["product_image"]}" height="62" width="62">
</div>
<div>Price : {$currency} {$row["product_price"]}<div>

<div class="item-box">
    <input name="product_code" type="hidden" value="{$row["product_code"]}">
    <button type="submit">open</button>
</div>
</form>
</li>
EOT;

}
$products_list .= '</ul></div>';
echo $products_list;
?>
<script>
$(document).on("click", ".w3-button", function() {
  $("#products_list").empty()
});</script>
</body>
</html>

Answer 1

将您用作jQuery选择器的相应ID添加到元素

更改

$products_list =  '<ul class="products-wrp">';

要

$products_list =  '<ul id ="products_list" class="products-wrp">';

重要的是要认识到浏览器中不存在任何php变量，只有服务器端代码

删除ajax调用中的现有产品内容

1 个答案: