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 相关文章推荐
JS与jQuery实现子窗口获取父窗口元素值的方法
Apr 17 jQuery
jquery将标签元素的高设为屏幕的百分比
Apr 19 jQuery
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 jQuery
jQuery操作css样式
May 15 jQuery
jquery版轮播图效果和extend扩展
Jul 18 jQuery
jQuery选择器之层次选择器用法实例分析
Feb 19 jQuery
基于 jQuery 实现键盘事件监听控件
Apr 04 jQuery
jquery.validate自定义验证用法实例分析【成功提示与择要提示】
Jun 06 jQuery
jQuery+ajax实现用户登录验证
Sep 13 jQuery
基于JQuery和DWR实现异步数据传递
Oct 16 jQuery
jQuery实现图片切换效果
Oct 19 jQuery
JQuery绑定事件四种实现方法解析
Dec 02 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的图形函数中显示汉字
2006/10/09 PHP
php下连接mssql2005的代码
2011/01/17 PHP
实例简介PHP的一些高级面向对象编程的特性
2015/11/27 PHP
php中数组最简单的使用方法
2020/12/27 PHP
jQuery前台数据获取实现代码
2011/03/16 Javascript
javascript模拟map输出与去除重复项的方法
2015/02/09 Javascript
JavaScript模拟重力状态下抛物运动的方法
2015/03/03 Javascript
javascript中for/in循环及使用技巧
2015/09/01 Javascript
javascript实现网页中涉及的简易运动(改变宽高、透明度、位置)
2015/11/29 Javascript
微信小程序 template模板详解及实例代码
2017/03/09 Javascript
JS+CSS实现下拉刷新/上拉加载插件
2017/03/31 Javascript
使用jQuery卸载全部事件的思路详解
2017/04/03 jQuery
zTree树形插件异步加载方法详解
2017/06/14 Javascript
如何从零开始手写Koa2框架
2019/03/22 Javascript
对layer弹出框中icon数字参数的说明介绍
2019/09/04 Javascript
VUE table表格动态添加一列数据,新增的这些数据不可以编辑(v-model绑定的数据不能实时更新)
2020/04/03 Javascript
Python 序列的方法总结
2016/10/18 Python
编写多线程Python服务器 最适合基础
2018/09/14 Python
python 格式化输出百分号的方法
2019/01/20 Python
Windows下Anaconda安装、换源与更新的方法
2020/04/17 Python
python 牛顿法实现逻辑回归(Logistic Regression)
2020/10/15 Python
用python-webdriver实现自动填表的示例代码
2021/01/13 Python
一家专门做特卖的网站:唯品会
2016/10/09 全球购物
路易威登和香奈儿手袋:LuxeDH
2017/01/12 全球购物
香港草莓网土耳其网站:Strawberrynet TR
2017/03/02 全球购物
美国一家主打母婴用品的团购网站:zulily
2017/09/19 全球购物
Gap工厂店:Gap Factory
2017/11/02 全球购物
Guess美国官网:美国知名服装品牌
2019/04/08 全球购物
某公司.Net方向面试题
2014/04/24 面试题
行政管理专业推荐信
2013/11/02 职场文书
拓展策划方案
2014/06/03 职场文书
还款承诺书范本
2015/01/20 职场文书
工作失职检讨书
2015/01/26 职场文书
介绍信怎么写
2015/05/05 职场文书
音乐课《小猫钓鱼》教学反思
2016/02/18 职场文书
tomcat默认最大连接数及相关调整方法
2022/05/06 Servers