jquery通过ajax加载一段文本内容的方法
本文实例讲述了jquery通过ajax加载一段文本内容的方法。分享给大家供大家参考。具体分析如下:
这是w3school官网提供的一个简单的例子,注意编码问题,否则可能会出现乱码。代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
var htmlObj = $.ajax({url:"ab.txt",async:false});//$.ajax() 返回其创建的 XMLHttpRequest 对象
$("#myDiv").html(htmlObj.responseText);
});
});
</script>
</head>
<body>
<div id="myDiv"><h2>hello world</h2></div>
<button>改变内容jquery-ajax</button>
</body>
</html>
希望本文所述对大家的jQuery程序设计有所帮助。
相关推荐
-
MVC Ajax Helper或Jquery异步加载部分视图
废话不多说了,直接给大家贴代码了. Model: namespace MvcApplication1.Models { public class Team { public string Preletter { get; set; } public string Name { get; set; } } } 通过jQuery异步加载部分视图 Home/Index.cshtml视图中: @{ ViewBag.Title = "Index"; Layout = "~/Views/
-
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
加载 HTML 我们通常使用加载 HTML 的方法来加载 HTML 片段,并插入到指定位置,假设当前页面为: <div></div> <button>load</button> 同目录下的 test.html 文件内容为: <span>test</span> 我们可以使用 load 方法来加载 HTML,将其绑定到按钮的点击事件上: $('button').click(function() { $('div').load('test.
-
JQuery实现Ajax加载图片的方法
本文实例讲述了JQuery实现Ajax加载图片的方法.分享给大家供大家参考,具体如下: 最近在学习JQuery,想从原理上模拟一下无刷新的相册浏览. 最先想到的思路是利用缓存,也就是先显示提示消息,然后get图片,在get完的时候回调,将img标签的src改掉,由于刚刚get过,有了缓存,所以图片会立刻显示出来. 页面元素: <input class="picbtn" type="button" value="Next" /> <
-
jQuery+PHP+ajax实现微博加载更多内容列表功能
在一些微博网站上我们经常可以看到这样的应用,微博内容列表上并没有使用分页条,而是一次加载一定数量的记录显示在列表页,当用户浏览到列表页底部时,可以通过单击"查看更多"来加载更多记录.本文将结合jQuery和PHP给大家讲述如何实现这种功能. Ajax加载的基本原理:当页面载入时,jQuery向后台请求数据,PHP通过查询数据库将最新的几条记录显示在列表页,在列表页的底部有个"查看更多"的链接,通过触发该链接,向服务端发送Ajax请求,后台PHP程序得到请求参数,并作
-
jQuery+AJAX实现无刷新下拉加载更多
随着互联网时代的发展,web前端已经和后台数据挂钩,作为web前端仅仅不是只切图写写html,css 和简单js交互. js code $(function() { var page = 1; var discount = $('#discount'); var innerHeight = window.innerHeight; var timer2 = null; $.ajax({ url: '/lightapp/marketing/verify/apply/list?page=1', t
-
jquery Ajax 实现加载数据前动画效果的示例代码
复制代码 代码如下: $(document).ready(function(){ $.ajax({ type:"get", cache:false, url:"ajaxpage.aspx?t=getcity", dataType:"json", beforeSend:function(){ $("#vvv").append('&l
-
php+ajax+jquery实现点击加载更多内容
我们在一些微博网站上可以碰到这样的应用,微博内容列表没有使用分页条,而是一次加载一定数量的记录显示在列表页,当用户浏览到列表页底部时,可以通过单击"查看更多"来加载更多记录.本文我将结合jQuery和PHP给大家讲述如何实现这种应用. 基本原理:页面载入时,jQuery向后台请求数据,PHP通过查询数据库将最新的几条记录显示在列表页,在列表页的底部有个"更多"链接,通过触发该链接,向服务端发送Ajax请求,后台PHP程序得到请求参数,并作出相应,获取数据库相应的记录
-
jQuery Ajax 加载数据时异步显示加载动画
ajax加载后台数据就不说的那么细了. 看下面代码首先前台上放置代码 <div id="loadgif" style="width:66px;height:66px;position:absolute;top:50%;left:50%;"> <img alt="加载中..." src="../../Images/loading1.gif"/> </div> 在js脚本文件中首先把这个图片动画
-
jquery通过ajax加载一段文本内容的方法
本文实例讲述了jquery通过ajax加载一段文本内容的方法.分享给大家供大家参考.具体分析如下: 这是w3school官网提供的一个简单的例子,注意编码问题,否则可能会出现乱码.代码如下: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <script type="text/
-
jquery实现ajax加载超时提示的方法
本文实例讲述了jquery实现ajax加载超时提示的方法.分享给大家供大家参考,具体如下: index.php <!doctype html> <html> <head> <meta charset="utf-8"/> <title>加载超时</title> <script type="text/javascript" src="http://lib.sinaapp.com/js
-
jQuery NProgress.js加载进度插件的简单使用方法
NProgress.js 说明: NProgress是基于jquery的,且版本要 >1.8 下载地址: https://github.com/rstacruz/nprogress API: NProgress.start() - 启动进度条 NProgress.set(0.4) - 将进度设置到具体的百分比位置 NProgress.inc() - 少量增加进度 NProgress.done() - 将进度条标为完成状态 使用步骤: 1. 引入 <link rel="styleshe
-
用JQuery 实现AJAX加载XML并解析的脚本
1,Content-Type 很多时候无法解析就是Content-Type的问题. 如果本身就是xml文件,请跳过这一步 动态生成的XML一定要将其设置为text/xml,否则默认就是text/html也就是普通的文本了. 常见语言的Content-Type设置 复制代码 代码如下: header("Content-Type:text/xml"); //php response.ContentType="text/xml" //asp response.setHea
-
详解使用Vue.Js结合Jquery Ajax加载数据的两种方式
整理文档,搜刮出一个使用Vue.Js结合Jquery Ajax加载数据的两种方式的代码,稍微整理精简一下做下分享. 废话不多说,直接上代码 html代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo</title> <script src="js/jquery.js"
-
jQuery中借助deferred来请求及判断AJAX加载的实例讲解
ajax请求异步队列加载 我们在开发程序的时候通常会碰到使用ajax加载数据显示到列表的情况.ajax默认使用异步加载(async:true).为什么不使用同步呢,因为ajax同步加载会UI渲染线程阻塞的问题.通常表现为在加载大量数据时由于加载时间过长导致页面不能点击.gif动画卡死以及浏览器崩溃等问题.所以,一般情况下,尽量使用ajax异步加载. 可是,我们有些时候的需求要求ajax同步加载,一个加载完再加载下一个,即所谓的队列.前面我们有说过,同步加载会引起UI渲染阻塞问题.那么我们要怎么实
-
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
本文实例讲述了jQuery+datatables插件实现ajax加载数据与增删改查功能.分享给大家供大家参考,具体如下: 这里给大家分享一下我在项目中用datatables实现ajax加载数据与增删改查 注意,需要引入jquery.datatables.layer html代码: <div class="thead"> <input placeholder="请输入搜索内容" id="searchTitle" type=&quo
-
jquery ajax加载数据前台渲染方式 不用for遍历的方法
如下所示: var provinces = res.res; var html = []; var option_select='<option value="" >请选择</option>'; var tpl = '<option value="{1}" data-id="{1}" data-name="{0}">{0}</option>'; html.push(option_
随机推荐
- Prototype Enumerable对象 学习第1/2页
- 把jQuery的each(callback)方法移植到c#中
- 开通局域网共享(访问本机无需验证即可进入的bat和注册表文件
- Angularjs 与 bower安装和使用详解
- 详细讲解vue2+vuex+axios
- JS实现黑客帝国文字下落效果
- IIS+fastcgi下PHP运行超时问题的解决办法详解
- php学习笔记 面向对象中[接口]与[多态性]的应用
- php+jQuery+Ajax简单实现页面异步刷新
- 数据库表分割技术浅析(水平分割/垂直分割/库表散列)
- 教你玩转Win XP注册表之性能优化
- Apache服务器中.htaccess文件的实用配置示例集锦
- c++线程池实现方法
- SpringMVC实现自定义类型转换器
- Android 根据EditText搜索框ListView动态显示数据
- 51files提供无限空间网络硬盘网络u盘
- Angular(5.2->6.1)升级小结
- Quartz集群原理以及配置应用的方法详解
- C++ 格式化日志输出实现代码
- 微信小程序实现文件、图片上传功能