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

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

Jun 13, 2016 am 09:19 AM
dreamweaver 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框架程序设计有所帮助。

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So passen Sie die Textposition in Dreamweaver an So passen Sie die Textposition in Dreamweaver an Apr 09, 2024 am 02:24 AM

Das Anpassen der Textposition in Dreamweaver kann durch die folgenden Schritte durchgeführt werden: Wählen Sie den Text aus und nehmen Sie mit dem Textpositionsregler horizontale Anpassungen vor: linke Ausrichtung, rechte Ausrichtung, mittlere Ausrichtung. 2. Nehmen Sie vertikale Anpassungen vor: obere Ausrichtung, untere Ausrichtung, vertikal 3. Drücken Sie die Umschalttaste und verwenden Sie die Pfeiltasten, um die Position zu verfeinern. 4. Verwenden Sie die Tastenkombinationen zur schnellen Ausrichtung: linke Ausrichtung (Strg/Befehl + L), rechte Ausrichtung (Strg/Befehl + R), zentrierte Ausrichtung (Strg/Befehlstaste + C).

So fügen Sie Videos zur Dreamweaver-Webseitenproduktion hinzu So fügen Sie Videos zur Dreamweaver-Webseitenproduktion hinzu Apr 09, 2024 am 01:42 AM

Video mit Dreamweaver einbetten: Fügen Sie ein Videoelement ein. Wählen Sie eine Videodatei aus und laden Sie sie hoch. Legen Sie Videotyp, URL, Größe, automatische Wiedergabe und Steuerelemente fest. Video einfügen. Optional: Passen Sie das Erscheinungsbild des Videos an.

So führen Sie das Thinkphp-Projekt aus So führen Sie das Thinkphp-Projekt aus Apr 09, 2024 pm 05:33 PM

Um das ThinkPHP-Projekt auszuführen, müssen Sie: Composer installieren, das Projektverzeichnis aufrufen und http://localhost:8000 aufrufen.

Es gibt mehrere Versionen von thinkphp Es gibt mehrere Versionen von thinkphp Apr 09, 2024 pm 06:09 PM

ThinkPHP verfügt über mehrere Versionen, die für verschiedene PHP-Versionen entwickelt wurden. Zu den Hauptversionen gehören 3.2, 5.0, 5.1 und 6.0, während Nebenversionen dazu dienen, Fehler zu beheben und neue Funktionen bereitzustellen. Die neueste stabile Version ist ThinkPHP 6.0.16. Berücksichtigen Sie bei der Auswahl einer Version die PHP-Version, die Funktionsanforderungen und den Community-Support. Für optimale Leistung und Support wird empfohlen, die neueste stabile Version zu verwenden.

So passen Sie den Zeilenabstand in Dreamweaver an So passen Sie den Zeilenabstand in Dreamweaver an Apr 09, 2024 am 03:00 AM

Das Anpassen des Zeilenabstands in Dreamweaver erfolgt in vier Schritten: Wählen Sie den Text aus, öffnen Sie das Absatzbedienfeld, passen Sie die Optionen für den Zeilenabstand an und klicken Sie abschließend auf „OK“, um die Änderungen zu übernehmen.

So führen Sie thinkphp aus So führen Sie thinkphp aus Apr 09, 2024 pm 05:39 PM

Schritte zum lokalen Ausführen von ThinkPHP Framework: Laden Sie ThinkPHP Framework herunter und entpacken Sie es in ein lokales Verzeichnis. Erstellen Sie einen virtuellen Host (optional), der auf das ThinkPHP-Stammverzeichnis verweist. Konfigurieren Sie Datenbankverbindungsparameter. Starten Sie den Webserver. Initialisieren Sie die ThinkPHP-Anwendung. Greifen Sie auf die URL der ThinkPHP-Anwendung zu und führen Sie sie aus.

So fügen Sie Bilder zu Dreamweaver hinzu So fügen Sie Bilder zu Dreamweaver hinzu Apr 09, 2024 am 03:30 AM

Um ein Bild in Dreamweaver einzufügen, klicken Sie auf das Menü „Einfügen“ und wählen Sie „Bild“, navigieren Sie dann zur Bilddatei und wählen Sie sie aus. Andere Methoden umfassen das Ziehen und Ablegen von Dateien oder das direkte Einfügen von HTML-Code. Das Anpassen von Eigenschaften umfasst das Ändern von Größe und Ausrichtung, das Hinzufügen von Rahmen und die Eingabe von Alternativtext.

So stellen Sie die Webdesign-Software Dreamweaver auf Chinesisch ein So stellen Sie die Webdesign-Software Dreamweaver auf Chinesisch ein Apr 09, 2024 am 12:39 AM

Um Dreamweaver auf Chinesisch einzustellen, gehen Sie folgendermaßen vor: Öffnen Sie Dreamweaver; ändern Sie die Sprache der Benutzeroberfläche in den Einstellungen. Starten Sie Dreamweaver neu, um die Spracheinstellungen zu überprüfen.

See all articles