jq04--jq与ajax
之前我们学习了一些有关jq函数的知识,现在我们看看jq与ajax方面的一些东西:
1.ajax(Asynchronous JavaScript and XML 异步的JavaScript与xml):
在不重载整个网页的情况下,ajax通过发送请求获取后台数据,显示在页面上。注意ajax并不是一种新的编程语言,而是使用现有标准的新方法。
2.jq与ajax:
jq提供多个与ajax有关的方法。通过jQuery AJAX方法,您能够使用HTTP Get和HTTP Post从远程服务器上
请求文本、HTML、XML或JSON,可以把这些外部数据直接载入网页的被选元素中。
如果没有jq,ajax编程并不容易。因为不同的浏览器,ajax的实现方式不一样,这通常意味着我们需要编写
额外的代码对浏览器进行测试。jq已经解决了这个问题,我们只需要一行代码即可进行ajax请求
3.load()方法:
$(selector).load(URL,data,callback);简单而强大的ajax方法,从服务器加载数据,并把返回的数据放入被选元素中
URL: 必选,请求URL
data: 可选,请求参数对象
callback: 可选,回调函数
//把文件"demo_test.txt"的内容加载到指定的<div>元素中
$("#div1").load("demo.txt");
//把文件"demo_test.txt"中id="p1"的元素的内容,加载到指定的<div>元素中
$("#div1").load("demo.txt #p1");
可选的callback回调函数可以设置三个参数:
responseTxt - 包含调用成功时的结果内容
statusTXT - 包含调用的状态
xhr - 包含 XMLHttpRequest 对象
$("button").click(function(){
$("#div1").load("demo.txt",function(responseTxt,statusTXT,xhr){
if("success"==statusTXT){
alert("内容加载成功");
}else if("error"==statusTXT){
alert("Error: "+xhr.status+": "+xhr.statusText);
}
});
});
4.GET与POST:
$.get(URL,callback):
$.post(URL,data,callback):
//$.get()方法从服务器上的一个文件中取回数据
$("button").click(function(){
$.get("demo.asp",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
}
); //ASP文件("demo.asp")类似这样:
<%
response.write("This is some text from an external ASP file.")
%>
//使用$.post()连同请求一起发送数据
$("button").click(function(){
$.post("demo.asp",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
}
);
}); //ASP文件("demo.asp")类似这样:
<%
dim fname,city
fname=Request.Form("name")
city=Request.Form("city")
Response.Write("Dear " & fname & ". ")
Response.Write("Hope you live well in " & city & ".")
%>
参考链接(get与post的区别):
https://www.cnblogs.com/logsharing/p/8448446.html
5.noConflict():
我们使用$作为jQuery的简写,当其他js框架也使用“$”作为简写时,如何才能避免冲突呢?使用noConflict()方法。noConflict()方法会释放$标识符的控制,这样其他脚本就可以使用它了。
//通过全名替代简写的方式来使用jQuery
$.noConflict();
jQuery(document).ready(function(){
jQuery("button").click(function(){
jQuery("p").text("jQuery 仍在运行!");
});
}); //noConflict()可返回对jQuery的引用,可以把它存入变量,以供稍后使用
var jq = $.noConflict();
jq(document).ready(function(){
jq("button").click(function(){
jq("p").text("jQuery 仍在运行!");
});
}); //把$符号作为变量传递给ready(),在函数内使用$符号,而在函数外,使用 "jQuery"
$.noConflict();
jQuery(document).ready(function($){
$("button").click(function(){
$("p").text("jQuery 仍在运行!");
});
});
jq04--jq与ajax的更多相关文章
- 关于jQ的Ajax操作
jQ的Ajax操作 什么是AJAX AJAX = 异步的javascript和XML(Asynchronous Javascript and XML) 它不是一门编程语言,而是利用JavaScript ...
- jq的ajax方法
相较与js异步对象的繁琐,jq的ajax对象结构更加清晰 一:ajax对象简述 ajax(Asynchronous JavaScript and XML),异步的xml和js对象,主要用于在不刷新全局 ...
- jq使用ajax请求,返回状态 canceled错误
在使用jq,ajax请求时出现该错误 原因:button按钮类型为type=submit ,script中又自定用botton按钮点击提交ajax,造成冲突. 解决方法:button按钮类型改为 ty ...
- 【jQuery】 JQ和AJAX
AJAX AJAX全称异步 JavaScript 和 XML(Asynchronous JavaScript and XML),是一种用于网页前端和网站后台进行数据交互的手段.关于AJAX的详细介绍在 ...
- jq的ajax交互封装
jq封装的ajax,然后 在此前和此后都是很多要考虑的 ,何不 想想构思封装下. 下面: 基本上网页都存在各种ajax,使得网页变得更加易于操作. 举个长长的例子吧: <input type= ...
- js、jq、ajax之间的关系
一句话:js是一种客户端脚本语言,jq是在js基础上封装起来的一个开发工具,ajax是基于js的一种技术(异步刷新). javascript是一种在客户端执行的脚本语言,用来给网页添加动态功能,使网页 ...
- jq之ajax以及json数据传递
<html> <head><meta http-equiv="Content-Type" content="text/html; chars ...
- AJAX04 JQ的AJAX
一.jQuery中的Ajax 1.jQuery为我们提供了更强大的Ajax封装 $.ajax({}) 可配置方式发起Ajax请求 $.get() 以GET方式发起Ajax请求 $.post() 以PO ...
- jq+jsonp+ajax解决跨域问题
Jsonp(JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料. 关于Jsonp更详细的资料请参考http://baike.baidu.com/ ...
- angular 和jq 的AJAX的请求区别
最近项目中使用angular,结果发现后台没法获取参数,所以,稍微研究了一下两者在发送ajax时的区别. 注意angular和jquery的ajax请求是不同的. 在jquery中,官方文档解释con ...
随机推荐
- cacti+CentOS6.5
系统版本:CentOS6.5 软件版本:cacti-0.88f 需要预安装的软件有以下几种,可以通过yum安装全部 yum -y install net-snmp* yum -y install op ...
- 第20章:MongoDB-聚合操作--聚合管道--$unwind
①$unwind 在查询数据的时候经常会返回数组信息,但是数组并不方便信息的浏览,所以提供有“$unwind”可以将数组数据变为独立的字符串内容. 将文档中数组类型的字段拆分成多条,每条文档包含数组中 ...
- python 基础_ 打印输出 循环分支2
一.在python3中的打印输出 1.输出字符串是print("hello world!!!") #输出字符串的时候可以是单引号括起来,也可以是双引号括起来.区别在于 2.输出变量 ...
- python中global 和 nonlocal的使用
1.global关键字用来在函数或其他局部作用域中使用全局变量.但是如果不修改全局变量也可以不使用global关键字. gcount = 0 def global_test(): gcount+=1 ...
- MySQL 安装与使用(一)
操作系统:CentOS release 5.10 (Final) 文件准备: MySQL-server-community-5.1.73-1.rhel5.i386.rpm MySQL-client-c ...
- session(会话)研究(一)基础
一.Session对象的生成 session对象生成的过程,可以通过一个直观图进行观察. 也就是说,客户第一次请求访问时,Cookie中是没有SessionID的.在第一次访问之后,由服务器生成一个S ...
- Qt_技巧_将Qt动态链接生成的exe与dll打包方法
刚开始接触Qt,发现mac平台直接release编译一下就能够直接生成.app文件,并且可以直接运行..app位于工程文件内. 同样发方法在Windows直接运行exe却出现缺失dll情况. 讲过网上 ...
- eclipse编辑器栏上的路径怎么去掉
找到这个按钮,点一下就可以了:
- java基础-day10
第10天 IO 今日内容介绍 u IO流概述及FileWriter类使用 u FileReader类使用 u 缓冲流介绍和使用 u IO流相关案例 第1章 IO流概述及FileWriter类使用 ...
- 杭电2133What day is it
给你个日期 问是星期几 知道1 1 1是周1就行了 #include <iostream>#include <cstdio>using namespace std ...