jquery在启动页面时,自动加载数据的实例


Posted in jQuery onJanuary 22, 2018

其实,重要的就是这个方法:

$(document).ready(function(){ 
}

具体的在jquery中:

具体的ajax怎么使用,可以查看我的上一篇博客《浅谈ajax在jquery中的请求和servlet中的响应》

<script type="text/javascript">
 $(document).ready(function(){
		var str = "";
		var strA = "";
  $.ajax({
 		type: "GET",
 	 url: "<%=path%>" + "/queryOrder.do",
 	 dataType: "json",
 	 async:false,
 	 data:{
 	 	 
 	 	 },
 	 success: function(data){
 	 	for (var i in data)
 	 	{
 	 		var num = parseInt(i) + 1;
 	 		var status = data[i]['status'];
 	 		if( status == 0 || status == -4){
 	 		strA = '<a class="m1" value="'+ data[i]['orderId'] +'">未处理</a>';
 	 		}else if( status == -1 || status == -2){
 	 		strA = '<a class="m2" value="'+ data[i]['orderId'] +'">已接受</a>';
 	 		}else if( status == -3){
 	 		strA = '<a class="m3" value="'+ data[i]['orderId'] +'">已完成</a>';
 	 		}
 	 		str +="<tr><td>" + num + "</td><td>" 
 	 			+ data[i]['ownerName'] + "</td><td>"
 	 			 + data[i]['telephone'] + "</td><td>" 
 	 			+ data[i]['hopeTimeName'] + "</td><td>" 
 	 			+ data[i]['build'] + "</td><td>"
 	 			+ data[i]['description'] + "</td><td>"
 	 			+ strA + "</td>";
 	 			+ "</tr>";
 	 	}
 	 		$(".tabletr").after(str);
 	 },
 	 error: function(data){
 	 	
 	 }
 		}) 	
 	});
</script>

在jsp中:

<div class="tab-pane active" id="A" style="text-align:center;">
   <div class="row marg" >
    <h3>维修单</h3>
    <table border="2 " style="width:100%;text-align:center;">
     <tr class="tabletr">
     	<th>序号</th>
     <th>业主名</th>
     <th>联系方式</th>
     <th>时间</th>
     <th>地址</th>
     <th>项目描述</th>
     <th>状态</th>
     </tr>
    </table>
    </div>
 </div>

以上这篇jquery在启动页面时,自动加载数据的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 jQuery
jQuery正则验证注册页面经典实例
Jun 10 jQuery
jQuery、layer实现弹出层的打开、关闭功能
Jun 28 jQuery
jQuery选择器之子元素选择器详解
Sep 18 jQuery
jquery 一键复制到剪切板的实例
Sep 20 jQuery
jQuery实现获取table中鼠标click点击位置行号与列号的方法
Oct 09 jQuery
jQuery实现页码跳转式动态数据分页
Dec 31 jQuery
jquery实现的简单轮播图功能【适合新手】
Aug 17 jQuery
jQuery实现ajax的嵌套请求案例分析
Feb 16 jQuery
JS/jQuery实现简单的开关灯效果【案例】
Feb 19 jQuery
jquery 回调操作实例分析【回调成功与回调失败的情况】
Sep 27 jQuery
jquery实现轮播图特效
Apr 12 jQuery
浅谈ajax在jquery中的请求和servlet中的响应
Jan 22 #jQuery
jquery+ajaxform+springboot控件实现数据更新功能
Jan 22 #jQuery
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 #jQuery
jQuery获取所有父级元素及同级元素及子元素的方法(推荐)
Jan 21 #jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 #jQuery
基于jquery的on和click的区别详解
Jan 15 #jQuery
vue-cli webpack 引入jquery的方法
Jan 10 #jQuery
You might like
PHP连接MySQL查询结果中文显示乱码解决方法
2013/10/25 PHP
详解PHP的Yii框架的运行机制及其路由功能
2016/03/17 PHP
Symfony2函数用法实例分析
2016/03/18 PHP
javascript IFrame 强制刷新代码
2009/07/23 Javascript
js的.innerHTML = &quot;&quot;IE9下显示有错误的解决方法
2013/09/16 Javascript
常见表单重复提交问题整理及解决方法
2013/11/13 Javascript
用Jquery选择器计算table中的某一列某一行的合计
2014/08/13 Javascript
浅谈JavaScript中的Math.atan()方法的使用
2015/06/14 Javascript
vue 运用mock数据的示例代码
2017/11/07 Javascript
微信开发之企业付款到银行卡接口开发的示例代码
2018/09/18 Javascript
[58:59]完美世界DOTA2联赛PWL S3 access vs CPG 第一场 12.13
2020/12/16 DOTA
Python break语句详解
2014/03/11 Python
Python数据结构之Array用法实例
2014/10/09 Python
零基础写python爬虫之使用urllib2组件抓取网页内容
2014/11/04 Python
Windows中使用wxPython和py2exe开发Python的GUI程序的实例教程
2016/07/11 Python
Django框架会话技术实例分析【Cookie与Session】
2019/05/24 Python
对Python 简单串口收发GUI界面的实例详解
2019/06/12 Python
Python实现把多维数组展开成DataFrame
2019/11/30 Python
Python计算公交发车时间的完整代码
2020/02/12 Python
40行Python代码实现天气预报和每日鸡汤推送功能
2020/02/27 Python
使用HTML5 Canvas为图片填充颜色和纹理的教程
2016/03/21 HTML / CSS
John Hardy官方网站:手工设计首饰的奢侈品牌
2017/07/05 全球购物
历史学专业个人的自我评价
2013/10/13 职场文书
医学生自荐信
2013/12/03 职场文书
网站开发实习生的自我评价
2013/12/11 职场文书
思想汇报格式
2014/01/05 职场文书
安全检查与奖惩制度
2014/01/23 职场文书
酒店营销策划方案
2014/02/07 职场文书
毕业生自荐信格式
2014/03/07 职场文书
公司活动总结范文
2014/07/01 职场文书
辞旧迎新演讲稿
2014/09/15 职场文书
设备收款委托书范本
2014/10/02 职场文书
对公司的意见和建议
2015/06/04 职场文书
创业计划书之溜冰场
2019/10/25 职场文书
mysql死锁和分库分表问题详解
2021/04/16 MySQL
css清除浮动clearfix:after的用法详解(附完整代码)
2023/05/21 HTML / CSS