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树插件zTree使用方法详解
May 02 jQuery
jQuery正则验证注册页面经典实例
Jun 10 jQuery
jQuery ajax动态生成table功能示例
Jun 14 jQuery
jQuery列表检索功能实现代码
Jul 17 jQuery
React中jquery引用的实现方法
Sep 12 jQuery
基于jquery.page.js实现分页效果
Jan 01 jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 jQuery
js和jQuery以及easyui实现对下拉框的指定赋值方法
Jan 23 jQuery
jQuery实现DIV响应鼠标滑过由下向上展开效果示例【测试可用】
Apr 26 jQuery
jQuery实现动态加载(按需加载)javascript文件的方法分析
May 31 jQuery
jQuery中DOM常见操作实例小结
Aug 01 jQuery
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 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
全国FM电台频率大全 - 11 浙江省
2020/03/11 无线电
不错的PHP学习之php4与php5之间会穿梭一点点感悟
2007/05/03 PHP
PHP操作XML作为数据库的类
2010/12/19 PHP
php读取富文本的时p标签会出现红线是怎么回事
2014/05/13 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
PHP实现UTF8二进制及明文字符串的转化功能示例
2017/11/20 PHP
YII框架http缓存操作示例
2019/04/29 PHP
laravel框架中路由设置,路由参数和路由命名实例分析
2019/11/23 PHP
jQuery中filter(),not(),split()使用方法
2010/07/06 Javascript
围观tangram js库
2010/12/28 Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
jQuery+CSS实现滑动的标签分栏切换效果
2015/12/17 Javascript
jQuery打字效果实现方法(附demo源码下载)
2015/12/18 Javascript
JS获取屏幕高度的简单实现代码
2016/05/24 Javascript
jQuery动态添加与删除tr行实例代码
2016/10/18 Javascript
Angularjs处理页面闪烁的解决方法
2017/03/09 Javascript
vue复合组件实现注册表单功能
2017/11/06 Javascript
Element-ui tree组件自定义节点使用方法代码详解
2018/09/17 Javascript
axios全局注册,设置token,以及全局设置url请求网段的方法
2018/09/25 Javascript
用原生 JS 实现 innerHTML 功能实例详解
2019/04/03 Javascript
Vue指令之 v-cloak、v-text、v-html实例详解
2019/08/08 Javascript
webpack5 联邦模块介绍详解
2020/07/08 Javascript
vue中提示$index is not defined错误的解决方式
2020/09/02 Javascript
python中django框架通过正则搜索页面上email地址的方法
2015/03/21 Python
python打开文件并获取文件相关属性的方法
2015/04/23 Python
详解python使用turtle库来画一朵花
2019/03/21 Python
详解Django-channels 实现WebSocket实例
2019/08/22 Python
Python API len函数操作过程解析
2020/03/05 Python
最好的意大利皮夹克:D’Arienzo
2018/12/04 全球购物
Farfetch台湾官网:奢侈品牌时尚购物平台
2019/06/17 全球购物
公司股权转让协议书
2014/04/12 职场文书
大学军训自我鉴定大全
2014/09/18 职场文书
小学四年级学生评语
2014/12/26 职场文书
党员公开承诺书2015
2015/01/21 职场文书
爱国之歌(8首)
2019/09/29 职场文书
Mysql官方性能测试工具mysqlslap的使用简介
2021/05/21 MySQL