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 相关文章推荐
个人总结的一些关于String、Function、Array的属性和用法
Jan 10 Javascript
JavaScript中json对象和string对象之间相互转化
Dec 26 Javascript
如何让页面加载完成后执行js
Jun 26 Javascript
HTML页面滚动时获取离页面顶部的距离2种实现方法
Sep 05 Javascript
删除javascript所创建子节点的方法
May 21 Javascript
jquery实现页面虚拟键盘特效
Aug 08 Javascript
使用Chart.js图表库制作漂亮的响应式表单
Oct 28 Javascript
学习Bootstrap滚动监听 附调用方法
Jul 02 Javascript
策略模式实现 Vue 动态表单验证的方法
Sep 16 Javascript
mpvue实现左侧导航与右侧内容的联动
Oct 21 Javascript
JS正则表达式验证端口范围(0-65535)
Jan 06 Javascript
vue-cli3自动消除console.log()的调试信息方式
Oct 21 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
构建简单的Webmail系统
2006/10/09 PHP
php时间函数用法分析
2016/05/28 PHP
laravel框架 laravel-admin上传图片到oss的方法
2019/10/13 PHP
jQuery弹出层插件简化版代码下载
2008/10/16 Javascript
jquery UI 1.72 之datepicker
2009/12/29 Javascript
jquery中页面Ajax方法$.load的功能使用介绍
2014/10/20 Javascript
Javascript基础教程之break和continue语句
2015/01/18 Javascript
JavaScript中使用concat()方法拼接字符串的教程
2015/06/06 Javascript
js和C# 时间日期格式转换的简单实例
2016/05/28 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
2016/05/31 Javascript
AngularJS基础 ng-init 指令简单示例
2016/08/02 Javascript
canvas 弹幕效果(实例分享)
2017/01/11 Javascript
webpack@v4升级踩坑(小结)
2018/10/08 Javascript
js实现简单的打印表格
2020/01/15 Javascript
vue导入.md文件的步骤(markdown转HTML)
2020/12/31 Vue.js
[46:12]完美世界DOTA2联赛循环赛 DM vs Matador BO2第一场 11.04
2020/11/04 DOTA
Python实现导出数据生成excel报表的方法示例
2017/07/12 Python
详谈Numpy中数组重塑、合并与拆分方法
2018/04/17 Python
Python实现二维曲线拟合的方法
2018/12/29 Python
解决PyCharm控制台输出乱码的问题
2019/01/16 Python
75条笑死人的知乎神回复,用60行代码就爬完了
2019/05/06 Python
Python 单例设计模式用法实例分析
2019/09/23 Python
Python如何使用turtle库绘制图形
2020/02/26 Python
Python爬虫工具requests-html使用解析
2020/04/29 Python
详解html2canvas截图不能截取圆角图片的解决方案
2018/01/30 HTML / CSS
浅析HTML5页面元素及属性
2021/01/20 HTML / CSS
Linux常见面试题
2013/03/18 面试题
团支书的期末学习总结自我评价
2013/11/01 职场文书
团员的自我评价
2013/12/01 职场文书
个人查摆问题及整改措施
2014/10/16 职场文书
民政局离婚协议书范本
2014/10/20 职场文书
优秀员工推荐材料
2014/12/20 职场文书
小学英语听课心得体会
2016/01/14 职场文书
大学迎新生的欢迎词
2019/06/25 职场文书
python模块与C和C++动态库相互调用实现过程示例
2021/11/02 Python
Java界面编程实现界面跳转
2022/06/16 Java/Android