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 相关文章推荐
JavaScript效率调优经验
Jun 04 Javascript
javascript实现的图片切割多块效果实例
May 07 Javascript
jQuery实现将页面上HTML标签换成另外标签的方法
Jun 09 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记8)
Dec 24 Javascript
javascript创建含数字字母的随机字符串方法总结
Aug 01 Javascript
jQuery实现的购物车物品数量加减功能代码
Nov 16 Javascript
Vue实例简单方法介绍
Jan 20 Javascript
Vue2.0 UI框架ElementUI使用方法详解
Apr 14 Javascript
vue.js 使用v-if v-else发现没有执行解决办法
May 15 Javascript
vuex 的简单使用
Mar 22 Javascript
vue使用echarts图表的详细方法
Oct 22 Javascript
Vue常用API、高级API的相关总结
Feb 02 Vue.js
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
详解PHP显示MySQL数据的三种方法
2008/06/05 PHP
php数组转换js数组操作及json_encode的用法详解
2013/10/26 PHP
利用WebBrowser彻底解决Web打印问题(包括后台打印)
2009/06/22 Javascript
javascript+html5实现仿flash滚动播放图片的方法
2015/04/27 Javascript
javascript创建动态表单的方法
2015/07/25 Javascript
JS实现iframe自适应高度的方法(兼容IE与FireFox)
2016/06/24 Javascript
AngularJS指令详解及示例代码
2016/08/16 Javascript
Angular学习笔记之angular的$filter服务浅析
2016/11/12 Javascript
轻松学习Javascript闭包
2017/03/01 Javascript
xmlplus组件设计系列之选项卡(Tabbar)(5)
2017/05/03 Javascript
JS中用EL表达式获取上下文参数值的方法
2018/03/28 Javascript
详解性能更优越的小程序图片懒加载方式
2018/07/18 Javascript
Nodejs实现的操作MongoDB数据库功能完整示例
2019/02/02 NodeJs
Vue实现table上下移动功能示例
2019/02/21 Javascript
浅入深出Vue之自动化路由
2019/08/06 Javascript
js操作两个json数组合并、去重,以及删除某一项元素
2020/09/22 Javascript
天翼开放平台免费短信验证码接口使用实例
2013/12/18 Python
python3访问sina首页中文的处理方法
2014/02/24 Python
python字典排序实例详解
2015/05/20 Python
玩转python爬虫之cookie使用方法
2016/02/17 Python
Python使用urllib2模块抓取HTML页面资源的实例分享
2016/05/03 Python
Python常见字符串操作函数小结【split()、join()、strip()】
2018/02/02 Python
Scrapy框架使用的基本知识
2018/10/21 Python
pycharm打开命令行或Terminal的方法
2019/01/16 Python
python3实现二叉树的遍历与递归算法解析(小结)
2019/07/03 Python
详解Python3 pandas.merge用法
2019/09/05 Python
Python3 中作为一等对象的函数解析
2019/12/11 Python
Python partial函数原理及用法解析
2019/12/11 Python
Python接口自动化判断元素原理解析
2020/02/24 Python
Softmax函数原理及Python实现过程解析
2020/05/22 Python
浅谈TensorFlow中读取图像数据的三种方式
2020/06/30 Python
美国便宜的横幅和标志印刷在线:Best of Signs
2019/05/29 全球购物
中文系学生自荐信范文
2013/11/13 职场文书
学校综治宣传月活动总结
2014/07/02 职场文书
校本课程教学计划
2015/01/19 职场文书
街道社区活动报告
2015/02/05 职场文书