使用ajax调用清空div

Question

Making a ajax, so when i click on this Link1 Button, i need to empty the contents in the products_list div 制作一个ajax，因此当我单击此Link1按钮时，我需要清空products_list div中的内容

<button type="w3-button">Link1</button>

Please help me on how to make a ajax call when clicking link1 button it empty the products in product_list 单击link1按钮将其清空product_list的产品时，请帮助我如何进行ajax调用

The below code contains a javascript to clear the contents of products_list but it do not work 下面的代码包含一个JavaScript，用于清除products_list的内容，但不起作用

PHP File PHP文件

 <?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 align="center">
<h3>Products</h3>
</div>

<script>
$(document).on("click", ".w3-button", function() {
  $('.products-wrp').html('')
 // $("#products_list").html();
});</script>
<?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 id ="products_list" 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>
</form>
</li>
EOT;

}
$products_list .= '</ul></div>';
echo $products_list;
?>
</body>
</html>

Answer 1

Check Code below that will empty the div On Failure on Ajax Request - 检查下面的代码，该代码将在Ajax请求失败时清空div-

 function getFailOutput() { $.ajax({ url:'myAjax.php', success: function (response) { console.log(data, response); $('#output').html(response); }, error: function () { //Empty Output Div ON Error Returned From Ajax Request $('#output').html(''); }, }); return false; }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a href="#" onclick="return getSuccessOutput();"> test success </a> | <a href="#" onclick="return getFailOutput(); return false;"> test failure</a> <div id="output">waiting for action</div>

使用ajax调用清空div

问题描述

1 个解决方案

解决方案1
1 已采纳 2017-05-21 14:12:49

使用ajax调用清空div

问题描述

1 个解决方案

解决方案1 1 已采纳 2017-05-21 14:12:49

解决方案1
1 已采纳 2017-05-21 14:12:49