jQuery+PHP实现点击按钮加载更多，不刷新页面加载更多数据！附：可用源码+demo

Ashin 发布于2019-06-28 18:26 / 2362人阅读

摘要：注意，里面需要引入库，自己可以去网上下载这个压缩版的。下面是数据库数据库账号，密码，地址这个根据自己的开发配置填，我的代码里面，数据库名为，表名为下面是结构截图就这么多了很简单吧本教程由里客云资源站提供

先上效果：

刚打开页面的时候，只显示部分数据，点击加载更多的时候，就会加载我们预先定义的加载数量显示出来！当数据库里面的所有数据都显示出来，就提示全部加载了！

新建index.php




    
    
    jQuery+php实现点击按钮加载更多
    


    
    
        
            
        
        数据加载中，请稍后...
        点击加载更多

上面是页面的布局，其中内嵌了php代码，这部分的代码其实就是查询数据库并输出数据库的所有数据。注意，index.php里面需要引入jQuery库，jquery.min.js自己可以去网上下载这个压缩版的。我把php代码全部用一个独立文件connect_sql.php写，然后通过

直接引入到index.php中

新建connect_sql.php

".$row[title]."";
        echo "
";
    }
?>

connect_sql.php就是简单的数据库查询并输出，但是输出的内容必须是套在

里面的。当然如果你想套在其他的标签里，那就在index.php里的js脚本里面自己改。

下面是数据库：
数据库账号，密码，地址这个根据自己的开发配置填，我的代码里面，数据库名为loadMore，表名为list
下面是结构截图：

Ok就这么多了
很简单吧！
本教程由里客云资源站提供
http://www.likeyunba.com/

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/28274.html

jQuery+PHP实现点击按钮加载更多，不刷新页面加载更多数据！附：可用源码+demo

摘要：注意，里面需要引入库，自己可以去网上下载这个压缩版的。下面是数据库数据库账号，密码，地址这个根据自己的开发配置填，我的代码里面，数据库名为，表名为下面是结构截图就这么多了很简单吧本教程由里客云资源站提供先上效果：showImg(https://segmentfault.com/img/bV37XZ?w=294&h=592); 刚打开页面的时候，只显示部分数据，点击加载更多的时候，就会...

LeoHsiun 2019-08-26 11:48 评论0 收藏0
RecyclerView封装库和综合案例【包含25篇博客】

摘要：支持复杂页面，例如添加自定义头部和底部布局，支持横向滑动，还可以支持粘贴头部类似微信好友分组，支持不规则瀑布流效果，支持侧滑删除功能。支持粘贴头部的需求效果，这种效果类似微信好友分组的那种功能界面。目录介绍 1.复杂页面库介绍 2.本库优势亮点 2.1 支持多种状态切换管理 2.2 支持添加多个header和footer 2.3 支持侧滑功能和拖拽移动 2.4 其他亮点介绍 ...

silenceboy 2019-08-16 17:02 评论0 收藏0
原生js滚动到底部加载数据和下拉刷新 Scrollload

摘要：原文地址初衷如今移动端站点越来越多，滚动到底部加载数据和下拉刷新的需求非常的常见，即使现在很多站点也会有这样的需求，比如百度首页就有。原文地址 https://github.com/fa-ge/Scrollload/blob/master/README.md 初衷如今移动端站点越来越多，滚动到底部加载数据和下拉刷新的需求非常的常见，即使现在很多pc站点也会有这样的需求，比如百度首页...

HollisChuang 2019-08-20 13:34 评论0 收藏0
RxJS 教程

摘要：是针对异步数据流的编程。所以这个数据流只包含一个简单的反射值。且慢，天生就是处理异步数据流的，为何不把请求的响应作为一个携带数据的流呢么么哒，概念上没有问题，我们就来操作一下。你需要明确通知观察者或者订阅者数据流的到达或者错误的发生。 Reactive Programming是神马？互联网上有很多不是很友好的解释。维基百科宽泛而玄乎。 Stackoverflow教科书式的解释非常不...

KnewOne 2019-08-19 17:22 评论0 收藏0
Web前端经典面试试题（三）

摘要：包含基于和标准的表示使用进行动态显示和交互使用与服务器进行异步通信使用绑定一切。重定向表示要完成请求，需要进一步操作。方法可将一个函数的对象上下文从初始的上下文改变为由指定的新对象。一. 什么是Ajax？？？术语Ajax用来描述一组技术，它使浏览器可以为用户提供更为自然的浏览体验。 Ajax它是Asynchronous JavaScript + XML的简写定义Ajax： ...

DrizzleX 2019-08-02 11:49 评论0 收藏0