Php 通过单击加载柱
我想通过点击加载帖子,我有两个文件Php 通过单击加载柱,php,jquery,ajax,Php,Jquery,Ajax,我想通过点击加载帖子,我有两个文件 使用ajax的index.php handler.php 我在学阿贾克斯。我理解这项技术,因此通过单击按钮,Ajax请求应该发生,然后处理程序将数据返回到Ajax请求,Ajax查询输出这些数据。但我做不到,为什么?如何修复错误?我的错误是没有加载帖子。控制台是空的。我将回声设置到处理程序的顶部,但它不起作用。我想ajax的问题是 index.php与ajax <!DOCTYPE html> <html> <head&g
- 使用ajax的index.php
- handler.php
<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel="stylesheet">
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
</head>
<body>
<main>
<!-- <article class="news">
<div class="picture"><img src="1news.jpg" width="300" height="300"></div>
<div class="aboutpost">
<h2 class="aboutpost-title">Пожар в торговом центре в Кемерово</h2>
<p class="aboutpost-description">Холдинг, куда входило ЧОП "Зимней вишни", прекратил работу после трагедии</p>
</div>
</article> -->
<?php
require 'infofordb.php';
$link = mysqli_connect($host, $user, $password, $database) or die("Ошибка " . mysqli_error($link));
$query ="SELECT * FROM news ORDER BY id DESC LIMIT 5";
$result = mysqli_query($link, $query) or die("Ошибка " . mysqli_error($link));
$articles = array();
while($row = mysqli_fetch_assoc($result)) {$articles[] = $row;}
foreach($articles as $article) {echo '
<article class="news">
<div class="picture">
<img src="/image/'.$article[path].'">
</div>
<div class="aboutpost">
<h2 class="aboutpost-title">'.$article[title].'</h2>
<p class="aboutpost-description">'.$article[description].'</p>
</div>
</article>';}
?>
<center><button id="load">Загрузить ещё</button></center>
<script>
$(document).ready(function(){
var inProgress = false;
var start = 5;
$('#load').click(function() {
$.ajax({
url: 'handler.php',
method: 'POST',
data: {"start" : start},
dataType: 'json',
beforeSend: function() {inProgress = true;}
}).done(function(data){
data = jQuery.parseJSON(data);
alert('nen');
if (data.length > 0) {
//надо вывести
$.each(data, function(index, data){
$('main').append(
'<article class="news"><div class="picture"><img src="/image/' + data.path +
+ '"></div><div class="aboutpost"><h2 class="aboutpost-title">' + data.title +
+ '</h2><p class="aboutpost-description">' + data.description +
+ '</p></div></article>');
});
inProgress = false;
start += 5;
}
});
});
});
</script>
</main>
</body>
</html>
Загрузить ещё
$(文档).ready(函数(){
var inProgress=假;
var起始值=5;
$('#加载')。单击(函数(){
$.ajax({
url:'handler.php',
方法:“POST”,
数据:{“开始”:开始},
数据类型:“json”,
beforeSend:function(){inProgress=true;}
}).完成(功能(数据){
data=jQuery.parseJSON(数据);
警惕(‘嫩’);
如果(data.length>0){
//надо вывести
$。每个(数据、函数(索引、数据){
$('main')。追加(
''+data.title+
+“”+data.description+
+“
”);
});
inProgress=假;
启动+=5;
}
});
});
});
handler.php
<?php
include(infofordb.php);
$start = $_POST['start'];
$link = mysqli_connect($host, $user, $password, $database) or die("Ошибка " . mysqli_error($link));
$query ="SELECT * FROM news ORDER BY id DESC LIMIT {$start}, 5";
$result = mysqli_query($link, $query) or die("Ошибка " . mysqli_error($link));
$articles = array();
while($row = mysqli_fetch_assoc($result)) {$articles[] = $row;}
echo json_encode($articles);
?>
dataType:'json',告诉jQuery解析返回的json数据。在代码中,调用JSON.parse尝试再次解析它,删除该行(这行我的意思是data=jQuery.parseJSON(data);
)。您需要在handler.php中检查mysql查询
$query ="SELECT * FROM news ORDER BY id DESC LIMIT {$start}, 5";
大括号在查询中不起作用。这可能会解决您的问题。如何修复错误?你的错误是什么?错误是什么?你检查控制台了吗?你收到警报(“nen”)了吗?你在handler.php中尝试过一些简单的输出吗?你正在使用哪个版本的jquery?别忘了打开你的浏览器控制台来检查是否有重大错误可能是因为你的jquery文件没有得到正确的路径。所有东西也不会加载帖子