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插件FusionWidgets实现的Bulb图效果示例【附demo源码下载】
Mar 23 jQuery
jQuery表单验证之密码确认
May 22 jQuery
基于jQuery的表单填充实例
Aug 22 jQuery
使用jQuery实现两个div中按钮互换位置的实例代码
Sep 21 jQuery
jquery ajax异步提交表单数据的方法
Oct 27 jQuery
详解jQuery中的isPlainObject()使用方法
Feb 27 jQuery
jQuery插件jsonview展示json数据
May 26 jQuery
JS与jQuery判断文本框还剩多少字符可以输入的方法
Sep 01 jQuery
jQuery中each遍历的三种方法实例分析
Sep 07 jQuery
jQuery分组选择器简单用法示例
Apr 04 jQuery
jquery实现垂直手风琴导航栏
Feb 18 jQuery
jquery实现直播视频弹幕效果
Feb 25 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中一个完整表单处理实现代码
2011/11/10 PHP
PHP的password_hash()使用实例
2014/03/17 PHP
分享下php5类中三种数据类型的区别
2015/01/26 PHP
PHP查询快递信息的方法
2015/03/07 PHP
PHP二维关联数组的遍历方式(实例讲解)
2017/10/18 PHP
JavaScript 编程引入命名空间的方法
2007/06/29 Javascript
JS模拟面向对象全解(二、类型与赋值)
2011/07/13 Javascript
单击复制文字兼容各浏览器的完美解决方案
2013/07/04 Javascript
使用javascript提交form表单方法汇总
2015/06/25 Javascript
jQuery设置Cookie及删除Cookie实例分析
2016/04/15 Javascript
js实现为a标签添加事件的方法(使用闭包循环)
2016/08/02 Javascript
AngularJS的ng-repeat指令与scope继承关系实例详解
2017/01/21 Javascript
微信小程序实现的贪吃蛇游戏【附源码下载】
2018/01/03 Javascript
React 组件转 Vue 组件的命令写法
2018/02/28 Javascript
浅谈jquery fullpage 插件增加头部和版权的方法
2018/03/20 jQuery
Vue列表渲染的示例代码
2018/11/01 Javascript
javascript网页随机点名实现过程解析
2019/10/15 Javascript
[07:55]2014DOTA2 TI正赛第三日 VG上演推进荣耀DKEG告别
2014/07/21 DOTA
[55:04]海涛DOTA2死魂复燃6.82版本介绍
2014/09/28 DOTA
一个小示例告诉你Python语言的优雅之处
2014/07/04 Python
python打开文件并获取文件相关属性的方法
2015/04/23 Python
Python使用自带的ConfigParser模块读写ini配置文件
2016/06/26 Python
Python简单实现socket信息发送与监听功能示例
2018/01/03 Python
python 实现二维字典的键值合并等函数
2019/12/06 Python
Python测试Kafka集群(pykafka)实例
2019/12/23 Python
使用Python爬取弹出窗口信息的实例
2020/03/14 Python
keras中的卷积层&amp;池化层的用法
2020/05/22 Python
施华洛世奇水晶荷兰官方网站:SWAROVSKI荷兰
2017/05/12 全球购物
英国最大的滑板品牌选择:Route One
2019/09/22 全球购物
自荐信如何“自荐”
2013/10/24 职场文书
2014升学宴答谢词
2014/01/26 职场文书
新教师工作感言
2014/02/16 职场文书
上课迟到检讨书300字
2014/10/15 职场文书
大学生个人总结范文
2015/02/15 职场文书
2015年班组工作总结
2015/04/20 职场文书
利用Java连接Hadoop进行编程
2022/06/28 Java/Android