jQuery简单的Ajax调用示例
jQuery确实方便,下面做个简单的Ajax调用:
建立一个简单的html文件:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function(){
//按钮单击时执行
$("#testAjax").click(function(){
//取Ajax返回结果
//为了简单,这里简单地从文件中读取内容作为返回数据
htmlobj=$.ajax({url:"/Readme.txt",async:false});
//显示Ajax返回结果
$("#myDiv").html(htmlobj.responseText);
});
});
</script>
</head>
<body>
<div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>
<button id="testAjax" type="button">Ajax改变内容</button>
</body>
</html>
好了,点击按钮就可以看到效果了。
当然,jQuery的Ajax调用可以控制项很多,这里演示了简单的调用。
注意你自己的jquery引用路径。
好吧,做一个调用后台的例子:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function(){
//按钮单击时执行
$("#testAjax").click(function(){ //Ajax调用处理
var html = $.ajax({
type: "POST",
url: "test.php",
data: "name=garfield&age=18",
async: false }).responseText;
$("#myDiv").html('<h2>'+html+'</h2>');
});
});
</script>
</head>
<body>
<div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>
<button id="testAjax" type="button">Ajax改变内容</button>
</body>
</html>
后台代码:
<?php
$msg='Hello,'.$_POST['name'].',your age is '.$_POST['age'].'!';
echo $msg;
现在已经可以从后台来获取数据了!
当然,我们还可以这样来调用Ajax:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function(){
//按钮单击时执行
$("#testAjax").click(function(){ //Ajax调用处理
$.ajax({
type: "POST",
url: "test.php",
data: "name=garfield&age=18",
success: function(data){
$("#myDiv").html('<h2>'+data+'</h2>');
}
}); });
});
</script>
</head>
<body>
<div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>
<button id="testAjax" type="button">Ajax改变内容</button>
</body>
</html>
注意,
success: function(data)
中的data参数可以改为别的名称,比如success: function(msg),msg(data)为返回的数据。 此处为回调函数的参数,而非
data: "name=garfield&age=18"
中的Ajax调用中的data参数。
jQuery简单的Ajax调用示例的更多相关文章
- jQuery简单的Ajax调用
index.php 的代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"& ...
- iframe式ajax调用示例
1.新建 a.html <!doctype html> <html> <head> <meta charset='utf-8'> <title&g ...
- 模拟jQuery简单封装ajax
/*模拟jQuery的写法 (简单写法)*/ var $={}; /*ajax*/ $.ajax = function (options) { /* * 请求 * 1.请求接口 type get po ...
- Jquery简单瀑布流代码示例
最近很多网站都采用瀑布流风格设计,感觉挺有个性的,比较合适做图片类型的网站,没事仿开心网做一个瀑布流示例. 需要用到Jquery,jquery.masonry.min.js <!DOCTYPE ...
- 最简单的ajax调用webservice
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestHelloWorld ...
- ajax 调用示例
$.ajax({ type: "post", url: url, data: { "key": "ValidateMobile", &quo ...
- jquery 封装的ajax调用
(function(){ var Ploy = { Config: { ajaxUrl: "/ajax/ploy.ashx" ...
- WebService--概述、JDk实现、AJAX调用
一.Webservice概述 W3C组织对其的定义是,它是一个软件系统,为了支持跨网络的机器间相互操作交互而设计. Webservice服务通常被定义为一组模块化的API,它们可以通过网络进行调用,来 ...
- Asp.net中JQuery、ajax调用后台方法总结
通过上一篇文章实例的实现,整个过程当中学习到很多知识点,了解了Jquery.Ajax在asp.net中的运用,加以总结,其实原理都是一样的,理解了一种,其他的注意很少的区别就可以了.灵活运用: 1.有 ...
随机推荐
- Sql 语句添加字段、修改字段类型、默认值语法
Sql 语句添加字段 ,) not null --修改类型 alter Table bbs ) Sql 语句修改默认值 alter table 表名 drop constraint 约束名字 --删除 ...
- android的task任务栈
转自http://blog.csdn.net/liuhe688/article/details/6761337 古人學問無遺力,少壯工夫老始成.紙上得來終覺淺,絕知此事要躬行.南宋.陸遊<冬夜讀 ...
- python的行与缩进
#coding=utf-8#逻辑行与物理行#以下是3个物理行print "abc"print "789"print "777" #以下是1个 ...
- 小学生之Oracle分析函数
分析函数是什么?分析函数是Oracle专门用于解决复杂报表统计需求的功能强大的函数,它可以在数据中进行分组然后计算基于组的某种统计值,并且每一组的每一行都可以返回一个统计值. 分析函数和聚合函数的不同 ...
- sql server根据日期或者月份查询聚合数据
/*****************************根据时间查询每天的数据***************************************/ @tm_start:开始时间 @tm ...
- VS2015编译器问题简单记录
问题:VS2015community 无法查找或打开 pdb 文件 解决办法: 1.点击工具->选项, 在选项窗口中展开左侧菜单: 2.展开调试->常规,然后在右边的窗格中勾选“启用服务器 ...
- php正则表达式总结
<?php echo 'wj'; echo '<br>'; $file = '<td>移动150卡</td><!--<td></td& ...
- .Net使用SSH.NET通过SSH访问Linux主机
使用了SSH.NET库,添加引用dll至项目,以下代码显示了点击按钮后SSH链接Linux主机执行命令并返回命令执行结果 protected void btnExcute_Click(object s ...
- (转)解析php中die(),exit(),return的区别
本篇文章是对php中die(),exit(),return的区别进行了详细的分析介绍,需要的朋友参考下 die()停止程序运行,输出内容exit是停止程序运行,不输出内容return是返回值d ...
- c# 预处理命令
在编译之前进行的处理. 预处理命令以符号“#”开头. #define 只能 定义符号 不能定义宏(#define PI 3.14 这是错的,在c#中没宏) #region #endregion #if ...