AJax技术

Ajax页面滚动自动加载实例教程

字号+ 作者:H5之家 来源:H5之家 2018-01-27 10:17 我要评论( )

课课家:相信很多学习Web开发的同学都对Ajax不怎么陌生,Ajax(其实是AsynchronousJavaScriptandXML的简称)是结合了Java技术、XML以及JavaScript等编程技术,可以

  相信很多学习Web开发的同学都对ajax不怎么陌生,Ajax(其实是AsynchronousJavaScriptandXML的简称)是结合了Java技术、XML以及等编程技术,可以让开发人员构建基于Java技术的Web应用,并打破了使用页面重载的惯例。Ajax是使用客户端脚本与Web服务器交换数据的Web应用开发方法。这样,Web页面不用打断交互流程进行重新加裁,就可以动态地更新。使用Ajax,用户可以创建接近本地桌面应用的直接、高可用、更丰富、更动态的Web用户界面。本文将用一个代码实例讲解怎么用ajax实现页面滚动自动加载内容图片。

Ajax页面滚动自动加载实例教程_ajax_Web开发_ajax自动加载_课课家

  好了,话不多说我们直接看代码,具体代码如下:

用ajax实现页面滚动自动加载内容图片

如何用ajax实现页面滚动自动加载内容图片

  在我们代码中一开始的 delay_till_last 函数是用来防止事件重复触发的,简单点讲也就是防止重复的内容被加载好多遍。

  而.postlist 为文章 li 的 ul,有两处我们要注意修改。

  然后我们来改造主循环,先在 function.php 里放一个函数,具体操作如下图所示:

在 function.php 里放一个函数

  Bing_is_ajax_list() 可以判断是否为 Ajax 请求,然后返回假为 Ajax。

  接下来我们来看看那主循环:

主循环

  最后要记得用 Bing_is_ajax_list() 判断,让为假(Ajax 请求)的时候把文章列表 ul 标签自身给去掉,然后只加载一堆 li

  总结:

  好啦,本篇关于用ajax实现页面滚动自动加载内容图片的实例教程到这里就结束啦,如果你对本篇教程的内容还有什么不明白的地方,欢迎你到本站搜索相关内容。

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 原生js封装ajax兼容jsonp实例分享

    原生js封装ajax兼容jsonp实例分享

    2018-01-27 13:34

  • js每隔5分钟执行一次ajax请求的实现方法

    js每隔5分钟执行一次ajax请求的实现方法

    2018-01-26 17:05

  • jquery+ajax+ashx

    jquery+ajax+ashx

    2018-01-26 16:04

  • ajax技术详解,封装一个原生的ajax请求

    ajax技术详解,封装一个原生的ajax请求

    2018-01-26 15:18

网友点评
5