ajax 页面无刷新,Ajax的页面无刷新实现详解(附代码)

be45eb6c5fd66d11a803e0291ef8bfd0.png

这次给大家带来Ajax的页面无刷新实现详解(附代码),Ajax页面无刷新实现的注意事项有哪些,下面就是实战案例,一起来看一下。

ajax (ajax开发)

AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。

AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。

现在一般网站都是用ajax来实现页面无刷新操作的。

什么是无刷新:ajax可以实现页面与后台的数据交互,用户完全感觉不出页面有任何的刷新,这就是AJAX的无刷新。

ajax方法实现:

可以对ajax进行一下封装,方便各个页面进行调用:

function MyAjax(type, url, callBack, data, dataType, asyncType)

{

if (dataType == null) { dataType = "text"; }

if (asyncType == null) {asyncType = true; }

$.ajax({

type: type, // post或者get

url: url , //url最好加一个url+Math.random(),这样可以保证每次请求的页面被浏览器视为不同

data: data, //这里是要传递的参数,格式为 data: "{paraName:paraValue}"

dataType: dataType, //string,xml,script,json,text

async:asyncType, //同步异步true /false

error: function (XmlHttpRequest, xmlhttp, info) {

},

success: function (result) {

//回调函数,result,返回值

callBack(result);

},

}); }

调用:MyAjax('post',"url?id=" + id, DoOK);

说明:async:true表示异步。此方式是说当ajax发送请求后,在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到server端返回正 确的结果才会去执行success,相当于开了两个线程;false是同步,即前台会等待server端返回数据后再执行。

相信看了本文案例你已经掌握了方法,更多精彩请关注php教程其它相关文章!

推荐阅读:

AJAX的XMLHttpRequest对象使用详解

ajax怎么实现服务器与浏览器长连接

Ajax和form+iframe实现文件上传的方法(图文详解)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/355302.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

运营管理最新版史蒂文森_运营增长人都在看的硬核案例拆解是怎么做的?

你会拆案例吗?大部分运营增长人听到这个问题都会愣一下,心想这有什么会拆不会拆的?看一下活动规则,把流程走一遍,不就可以了?当马上要做活动但又没思路缺灵感时,我们通常会试着先去关注一下相关…

pc网站和移动网站在同一服务器吗,机动都市阿尔法PC服和移动服互通吗

机动都市阿尔法PC服已经开启了,很多小伙伴想知道这个PC服和移动服有什么区别,互通情况怎么样,下面就是机动都市阿尔法PC服和移动服互通的具体内容,一起来看看吧。PC服和移动服互通吗国服PC版开启时,将额外增设一个独立…

ssh结合使用

springxml配置 <?xml version"1.0" encoding"UTF-8"?> <web-app xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xmlns"http://xmlns.jcp.org/xml/ns/javaee"xsi:schemaLocation"http://xmlns.jcp.org/xml/ns/…

teamcity_TeamCity构建依赖项

teamcity介绍 构建依赖关系的主题既非琐碎的&#xff0c;也非次要的。 各种构建工具从不同的角度处理此主题&#xff0c;从而提供了各种解决方案&#xff0c;每种解决方案都有其优点和缺点。 熟悉发行版和快照依赖关系的Maven和Gradle用户可能不了解TeamCity快照依赖关系&…

OC Swift 走马灯效果

我们常见走马灯样式的功能&#xff0c;下面整理一下 Object-C 与 Swift 的实现代码 OC UILabel *label3 [[UILabel alloc] initWithFrame:CGRectMake(10,200, self.view.bounds.size.width, 100)]; label3.backgroundColor [UIColor redColor]; label3.text "走马灯 走马…

sql怎么修改服务器角色,创建、删除或修改角色 (Management Studio)

创建、删除或修改角色 (Management Studio)06/13/2017本文内容Reporting Services 提供了定义对报表服务器的访问级别的预定义角色。 需要访问报表服务器的每个用户或组都通过说明可以执行的任务的角色来进行访问。 这些角色是对作为整体的报表服务器进行定义的。 不能对报表服…

python中产生随机数模块_Python中random模块生成随机数详解

Python中的random模块用于生成随机数。下面介绍一下random模块中最常用的几个函数。random.randomrandom.random()用于生成一个0到1的随机符点数: 0 < n < 1.0random.uniformrandom.uniform的函数原型为&#xff1a;random.uniform(a, b)&#xff0c;用于生成一个指定范围…

刷新器-Java EE 7后端十大功能

这是我的Java EE 7小知识系列的第二部分。 在进行简要介绍的第一个介绍之后&#xff0c;我决定请Arjan Tijms撰写有关Java EE 7中他最喜欢的新后端功能的文章。如果您关注Java EE领域&#xff0c;您将知道Arjan。 他是Java EE开发人员&#xff0c;JSF和Security EG的长期成员&a…

get方法 服务器响应,HTTP请求方法及响应码详解(http get post head)

HTTP是Web协议集中的重要协议&#xff0c;它是从客户机/服务器模型发展起来的。客户机/服务器是运行一对相互通信的程序&#xff0c;客户与服务器连接时&#xff0c;首先&#xff0c;向服务器提出请求&#xff0c;服务器根据客户的请求&#xff0c;完成处理并给出响应。浏览器就…

spark官方文档_这些未在 Spark SQL 文档中说明的优化措施,你知道吗?

本文来自上周(2020-11-17至2020-11-19)举办的 Data AI Summit 2020 (原 SparkAI Summit)&#xff0c;主题为《Spark SQL Beyond Official Documentation》的分享&#xff0c;作者 David Vrba&#xff0c;是 Socialbakers 的高级机器学习工程师。实现高效的 Spark 应用程序并获…

从位图数据取得位图句柄

#include <windows.h> #include <fstream> using namespace std; void main() { ifstream infile("bm.bmp", ios::in | ios::binary); BITMAPFILEHEADER bmpHeader; // 获取文件大小 infile.seekg(0, ios::end); long nfilelen infile.tell…

go从0到1项目实战体系二一:gin框架安装

(1). 设置公用的代理服务地址: 如果设置了全局可忽略. $ export GOPROXYhttps://goproxy.io // linux > go env可以查看 $ export GOPROXYhttps://goproxy.cn // linux国内镜像 $ set GOPROXYhttps://goproxy.io // windows(2). 创建以下目录: 请忘记GOPATH目录…

一键对频对讲机好吗_挑战传统,新型对讲机展现独特一面--极蜂智能网络对讲机...

说起对讲机你首先想到的是什么样子的&#xff0c;是香港电影中警察佩戴的那种&#xff0c;还是国内建筑工地上使用的傻大粗那种&#xff0c;不过无论是哪种形状的&#xff0c;现实中确实非常的实用。不过随着科技的发展&#xff0c;很多不可能的事情已经变为现实&#xff0c;而…

核心动画与UIView

UIView与核心动画区别?(掌握)1.核心动画只作用在layer.2.核心动画看到的都是假像,它并没有去修改UIView的真实位置.什么时候使用核心动画?1.当不需要与用户进行交互,使用核心动画2.当要根据路径做动画时,使用核心动画&#xff1a;CABasicAnimation&#xff0c;CAKeyFrameAnim…

mongodb 性能测试_MongoDB性能测试

mongodb 性能测试因此&#xff0c;今天早上&#xff0c;我在mongo shell中四处乱逛。 我想出了三种不同的方式来聚合所需的数据&#xff0c;但是不确定随后应移植哪种代码以在应用程序中使用。 那么&#xff0c;我将如何决定实施哪种方法呢&#xff1f; 好吧&#xff0c;让我们…

swift x输入流_Swift 中不同窗体的切换和传递数据 (segue 的用法)

废话不多说&#xff0c;直接进入正题首先在 storyboard 中新建一个 ViewController&#xff0c;再新建一个名为 NewViewController 的 cocoa touch class 文件&#xff0c;继承 UIViewController&#xff0c;将新建的 ViewController 绑定到 NewViewController 类上。现在 stor…

提防Java中的函数式编程!

这对函数式编程并不会造成太大的影响&#xff0c;这真棒。 这是关于某些实践的警告&#xff0c;您很可能会将其应用于您的代码&#xff0c;而这完全是错误的&#xff01; 。 高阶函数对于函数式编程是必不可少的&#xff0c;因此&#xff0c;谈论它们将帮助您成为聚会中的焦点…

LoadRunner脚本增强技巧之检查点

检查点的设置理解起来非常简单&#xff0c;就是要在服务器返回的页面中检查是否存在关键信息。检查点函数的错误会导致整个脚本运行结果的失败&#xff0c;通过这个功能可以方便地定位脚本运行中的逻辑错误。检查点的设置通常分为两种&#xff0c;一种是对文字的检查&#xff0…

苹果app商品定价_App Store 即将进行价格调整

当税率或外汇汇率变化时&#xff0c;我们有时需要更新 App Store 中的价格。即日起&#xff0c;巴基斯坦、哥伦比亚和台湾 App Store 中的产品价格(不包括自动续期订阅)将会上调。此次价格上调基于以下税率变化&#xff1a;• 哥伦比亚&#xff1a;自 2019 年 1 月 1 日起开始实…

es2016

对象解构 http://www.jb51.net/article/70140.htm 转载于:https://www.cnblogs.com/oneboi/p/7092847.html