ajax如何显示页面,如何用ajax显示页面？

我有一个正常工作的分页,即使我已经添加了一个过滤器来分页同一页面上的更多行,也就是说通过过滤器我可以显示10行或50行.

我在代码中遇到的一个小缺陷就是页面被重新加载,改变了显示的行数,并且在分页的按钮中也是如此.

这是我的代码,一切都在同一页面index2.php上工作.

$select_quantity = '';

if (isset($_POST['amount_show'])) :

$select_quantity = $_POST['amount_show'];

endif;

?>

">

>10

>25

>50

>100

if (isset($_GET['page'])) :

$page = $_GET['page'] ?: '';

else :

$page = 1;

endif;

if (isset($_POST['amount_show'])) :

$records_by_page = $_POST['amount_show'];

else :

$records_by_page = 10;

endif;

$localization_sql = ($page-1) * $records_by_page;

$sql = "SELECT id,title,description

FROM news

ORDER BY id DESC LIMIT $localization_sql, $records_by_page";

$stmt = $con->prepare($sql);

$stmt->execute();

$stmt->store_result();

if ($stmt->num_rows>0) :

echo '

IdTitleDescriptionAction

';

$stmt->bind_result($id,$title,$description);

while ($stmt->fetch()) :

echo '

'.$id.''.$title.''.$description.'Edit';

endwhile;

echo '

';

echo '

';

$stmt->close();

$sql = "SELECT * FROM news";

$stmt = $con->prepare($sql);

$stmt->execute();

$stmt->store_result();

$BD_records = $stmt->num_rows;

$stmt->close();

$con->close();

$total_page = ceil($BD_records / $records_by_page);

$prev = $page - 1;

$next = $page + 1;

echo '

• ';

if ($prev > 0) :

echo "

";

echo "

";

endif;

for ($i=1; $i<=$total_page; $i++) :

if ($page==$i) :

echo "

". $page . "";

else :

echo "

$i";

endif;

endfor;

if ($page < $total_page ) :

echo "

";

echo "

";

endif;

echo '

';

else :

$stmt->close();

endif;

?>

在网上搜索时,我发现了一个ajax代码,但是真诚地,我没有管理使用ajax或javascript/jquery代码.

您可以解释如何实现此ajax代码或如何避免重新加载页面的小缺陷.

$(document).ready(function() {

$('.pagination li a').on('click', function(){

/*$('.items').html('

Loading...

');*/

$('.items').html('

Loading...

');

var page = $(this).attr('data');

var dataString = 'page='+page;

$.ajax({

type: "GET",

url: "ajax.php",

data: dataString,

success: function(data) {

$('.items').fadeIn(2000).html(data);

$('.pagination li').removeClass('active');

$('.pagination li a[data="'+page+'"]').parent().addClass('active');

}

});

return false;

});

});

这就是我的代码的工作方式,如下图所示: