recherche
Maisonphp教程php手册thinkPHP实现瀑布流的方法,thinkphp实现瀑布

thinkPHP实现瀑布流的方法,thinkphp实现瀑布

本文实例讲述了thinkPHP实现瀑布流的方法。分享给大家供大家参考。具体分析如下:

很多人都想做瀑布流的效果,这里告诉大家官网使用的方法,首先要下载瀑布流的插件jquery.masonry.min.js 地址:http://masonry.desandro.com/index.html里面包含的很多示例.

流程:

1. 页面初始化时,调用插件进行一次排版;

2. 当用户将滚动条拖到底部时,用ajax加载一次数据,并排版显示

3. 重复2,直到无数据

Html代码:

复制代码 代码如下:

 
 

 
 
Insert title here 
 
 
 
 
 
 
 
 
 
 
 
 
 
瀑布流下来了
 
 
 
 
 
 
 
加载中,请稍后... 
 
 
 
 
 
 
 

Action代码:

复制代码 代码如下:

//初始化的数据 
public function lists(){  
$data = D('Info')->order('id DESC')->limit(10)->select(); 
$this->assign('data', $data); 
$this->display(); 

//获取一次请求的数据 
public function getMore(){  
//获取最后一个id 
if(!emptyempty($_GET['lastid']))$map['id'] = array('lt', $_GET['lastid']);  
$data = D('Info')->where($map)->order('id DESC')->limit(10)->select(); 
$this->ajaxReturn($data); 
}

注意:通过判断窗口是否滚动到页面底部来决定用ajax加载一次数据,如果不做处理,会一下子请求很多次,所以,要使用条件来限制.

这里使用的是往一个元素上赋值 $("#loading").data("on", true);,在请求期间判断是true则不继续请求,然后在页面请求完成后再赋值为false.

希望本文所述对大家的ThinkPHP框架程序设计有所帮助。

Déclaration
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Commandes de chat et comment les utiliser
1 Il y a quelques moisBy尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Version crackée d'EditPlus en chinois

Version crackée d'EditPlus en chinois

Petite taille, coloration syntaxique, ne prend pas en charge la fonction d'invite de code

Version Mac de WebStorm

Version Mac de WebStorm

Outils de développement JavaScript utiles

Navigateur d'examen sécurisé

Navigateur d'examen sécurisé

Safe Exam Browser est un environnement de navigation sécurisé permettant de passer des examens en ligne en toute sécurité. Ce logiciel transforme n'importe quel ordinateur en poste de travail sécurisé. Il contrôle l'accès à n'importe quel utilitaire et empêche les étudiants d'utiliser des ressources non autorisées.

SublimeText3 version anglaise

SublimeText3 version anglaise

Recommandé : version Win, prend en charge les invites de code !

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP