jquery ajax 简单范例(界面+后台)


Posted in Javascript onNovember 19, 2013

界面:

<script> 
$(document).ready(function () { 
$("#b01").click(function () { 
htmlobj = $.ajax({ url: "/Content/upFile/测试.txt", async: false }); 
$("#div01").html(htmlobj.responseText); 
}); 
}); $(document).ready(function () { 
$("#test").load("/Content/upFile/测试2.txt #p1", function (responseTxt, statusTxt, xhr) { 
if (statusTxt == "success") 
alert("外部内容加载成功!" + xhr); 
if (statusTxt == "error") 
alert("Error: " + xhr.status + ": " + xhr.statusText); 
}); 
}); 
$(document).ready(function () { 
$("#getbutton").click(function () { 
$.get("/DownSet/index", function (data, status) { 
alert("数据:" + data + "\n状态:" + status); 
}); 
}); 
}); 
$(document).ready(function () { 
$("#postbutton").click(function () { 
$.get("/CustomerInformation/getS", { par: "ww" }, function (data, status) { 
alert("数据:" + data + "\n状态:" + status); 
$("#postText").html(data); 
}); 
}); 
}); 
</script> 
<div id="div04"> 
<h2 id="postText">post方法加载文本后 会在这里显示</h2> 
<input type="button" value="post方法获取" id="postbutton" /> 
</div> 
<div id="div03"> 
<h2 id="getText">get方法加载文本后 会在这里显示</h2> 
<input type="button" value="get方法获取" id="getbutton" /> 
</div> 
<div id="div02"> 
<h2>jquery load方法加载的显示在这里</h2> 
<h2 id="test">加载文本后 会在这里显示</h2> 
</div> 
<div id="div01"> 
<h2>加载文本后 会在这里显示</h2> 
</div> 
<p> 
<input type="button" value="加载文本" id="b01"/> 
</p>

后台:
public string getS(string par) 
{ 
string content = ""; 
if (par.Equals("ww")) 
{ 
content = "cheng gong le"; 
} 
else 
{ 
content = "shi bai le"; 
} 
return content; 
}
Javascript 相关文章推荐
jQuery基本选择器选择元素使用介绍
Apr 18 Javascript
JS小功能(setInterval实现图片效果显示时间)实例代码
Nov 28 Javascript
JS数组的赋值介绍
Mar 10 Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
Jun 17 Javascript
JavaScript使用forEach()与jQuery使用each遍历数组时return false 的区别
Aug 26 Javascript
浅谈Vue.use的使用
Aug 29 Javascript
Nuxt.js开启SSR渲染的教程详解
Nov 30 Javascript
详解vue项目中实现图片裁剪功能
Jun 07 Javascript
vue.js购物车添加商品组件的方法
Sep 17 Javascript
Vue 使用beforeEach实现登录状态检查功能
Oct 31 Javascript
原生js实现滑块区间组件
Jan 20 Javascript
Javascript中的解构赋值语法详解
Apr 02 Javascript
javaScript array(数组)使用字符串作为数组下标的方法
Nov 19 #Javascript
简单时间提示DEMO从0开始一直进行计时
Nov 19 #Javascript
鼠标滑在标题上显示图片的JS代码
Nov 19 #Javascript
JS简单实现登陆验证附效果图
Nov 19 #Javascript
JS随机漂浮广告代码具体实例
Nov 19 #Javascript
JS简单实现元素复制示例附图
Nov 19 #Javascript
js获取当月最后一天实例代码
Nov 19 #Javascript
You might like
re0第二季蕾姆被制作组打入冷宫!艾米莉亚女主扶正,原因唏嘘
2020/04/02 日漫
PHP 程序授权验证开发思路
2009/07/09 PHP
java微信开发之上传下载多媒体文件
2016/06/24 PHP
漂亮的thinkphp 跳转页封装示例
2019/10/16 PHP
学习YUI.Ext 第四天--对话框Dialog的使用
2007/03/10 Javascript
jquery 全局AJAX事件使用代码
2010/11/05 Javascript
Javascript图像处理思路及实现代码
2012/12/25 Javascript
JQuery切换显示的效果实例代码
2013/02/27 Javascript
js中的数组Array定义与sort方法使用示例
2013/08/29 Javascript
15款jQuery分布引导插件分享
2015/02/04 Javascript
JS实现点击颜色块切换指定区域背景颜色的方法
2015/02/25 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
2016/05/28 Javascript
Bootstrap学习笔记之js组件(4)
2016/06/12 Javascript
Node.js连接postgreSQL并进行数据操作
2016/12/18 Javascript
详解JS中的立即执行函数
2017/02/24 Javascript
Vue2组件tree实现无限级树形菜单
2017/03/29 Javascript
用 js 的 selection range 操作选择区域内容和图片
2017/04/18 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
2017/05/17 Javascript
Vue.js中provide/inject实现响应式数据更新的方法示例
2019/10/16 Javascript
Element Badge标记的使用方法
2020/07/27 Javascript
vue绑定class的三种方法
2020/12/24 Vue.js
[02:38]DOTA2亚洲邀请赛 IG战队巡礼
2015/02/03 DOTA
Python的collections模块中namedtuple结构使用示例
2016/07/07 Python
在python3环境下的Django中使用MySQL数据库的实例
2017/08/29 Python
Python的numpy库下的几个小函数的用法(小结)
2019/07/12 Python
Pandas0.25来了千万别错过这10大好用的新功能
2019/08/07 Python
Python循环实现n的全排列功能
2019/09/16 Python
wxpython布局的实现方法
2019/11/01 Python
Python如何输出百分比
2020/07/31 Python
PyQt实现计数器的方法示例
2021/01/18 Python
adidas旗下高尔夫装备供应商:TaylorMade Golf(泰勒梅高尔夫)
2016/08/28 全球购物
澳大利亚排名第一的露营和户外设备在线零售商:Outbax
2020/05/06 全球购物
2014年小班保育员工作总结
2014/12/23 职场文书
思想品德课教学反思
2016/02/24 职场文书
大学生入党自我鉴定范文
2019/06/21 职场文书
Nginx速查手册及常见问题
2022/04/07 Servers