jQuery前台数据获取实现代码


Posted in Javascript onMarch 16, 2011

jProviderData

/// <reference path="jUtil.js" /> $j = jQuery.noConflict(); 
(function ($j) { 
$j.providerData={ 
defaultSettings: { 
select_Span_Items: false, 
select_TD_Items: false, 
select_LI_Items: false 
}, 
init:function(options){ 
opts = $j.extend({}, $j.providerData.defaultSettings, options); 
singleItemJsonFormat='"{0}":"{1}"'; 
divItemFormat='{{0}}'; 
tableItemFormat='{0}'; 
}, 
getDataName:function(item){ 
var dataName = item.attr("dataname"); 
if(typeof dataName === 'undefined'||dataName==""){ 
dataName = item.attr("Id"); 
} 
if(typeof dataName === 'undefined'||dataName==""){ 
dataName=item.text(); 
} 
if(typeof dataName === 'undefined'||dataName==""){ 
dataName=item[0].innerText; 
} 
return dataName; 
}, 
getData:function(selector){ 
//var selector=opts.selector; 
var items; 
if(typeof selector!=="object"){ 
items=$j(selector); 
} 
else{ 
items=selector; 
} 
var retJsonValue=""; 
var subSelector=":input"; 
if (opts.select_Span_Items) { 
subSelector = subSelector + ",span"; 
} 
if (opts.select_LI_Items) { 
subSelector = subSelector + ",li"; 
} 
if(opts.select_TD_Items){ 
subSelector = subSelector + ",td"; 
} 
$j.each(items,function(i,item){ 
var t=$j(this); 
var dataName=$j.providerData.getDataName(t); 
//return:'{"dataname":"value"}' 
if($j.util.isInput(t)){ 
var value=t.val(); 
var itemStr= String.format(singleItemJsonFormat,dataName,value); 
retJsonValue=retJsonValue+itemStr+","; 
retJsonValue=retJsonValue.trimEnd(","); 
} 
//return:'{"dataname1":"value1","dataname2":"value2"}' 
else if($j.util.isDiv(t)){ 
var subItems = t.find(subSelector); 
var subStr = ""; 
$j.each(subItems, function (i, subItem) { 
//递归调用 处理子元素 
var tempSubItemStr = $j.providerData.getData("#"+$j(this).attr("id")); 
subStr = subStr + "," + tempSubItemStr; 
}) 
subStr=subStr.trimStart(","); 
retJsonValue=String.format(divItemFormat,subStr); 
} 
//return:'[{"dataname1":"value1","dataname2":"value2"},{"dataname1":"value3","dataname2":"value4"}]' 
else if($j.util.isTable(t)){ 
var trItems=t.find("TR:gt(0)"); 
//迭代处理Table中的每一行 
$j.each(trItems,function(i,trItem){ 
//处理行,找出行中的要收集数据的元素 
var subItems =$j(this).find(subSelector); 
var subStr = ""; 
//迭代处理行中所有需要收集数据的元素 
$j.each(subItems,function(i,subItem){ 
if($j.util.isInput($j(this))){ 
var tempSubItemStr = $j.providerData.getData("#"+$j(this).attr("id")); 
subStr = subStr + "," + tempSubItemStr; 
} 
else{ 
//如果是TD元素,且他里面不包含INPUT元素 
if( $j.util.isTD($j(this)) && ($j(this).find(":input").length==0)){ 
var tempSubItemStr = $j.providerData.getData($j(this)); 
subStr = subStr + "," + tempSubItemStr; 
} 
} 
}); 
subStr=subStr.trimStart(","); 
retJsonValue= retJsonValue+String.format(divItemFormat,subStr)+","; 
}); 
retJsonValue=retJsonValue.trimEnd(","); 
retJsonValue="["+retJsonValue+"]"; 
} 
//return:'{"dataname":"value"}' 
else if($j.util.isLi(t)){ 
var value=t.text(); 
var itemStr= String.format(singleItemJsonFormat,dataName,value); 
retJsonValue=retJsonValue+itemStr+","; 
retJsonValue=retJsonValue.trimEnd(","); 
} 
//return:'{"dataname":"value"}' 
else if($j.util.isTD(t)){ 
var value=t.text(); 
// var rowIndex = t.parent().prevAll().length; 
//获取当前列的列索引 
var colIndex = t.prevAll().length; 
//dataName由列的的列头中dataName属性决定,如果找不到由列头的内容决定 
var thItem=t.parent().parent().parent().find("th:eq("+colIndex+")"); 
if(thItem.length==1){ 
dataName=$j.providerData.getDataName(thItem); 
} 
var itemStr= String.format(singleItemJsonFormat,dataName,value); 
retJsonValue=retJsonValue+itemStr+","; 
retJsonValue=retJsonValue.trimEnd(","); 
} 
}); 
return retJsonValue; 
} 
}; 
jProviderData=function(options){ 
$j.providerData.init(options); 
return $j.providerData.getData(options.selector); 
}; 
})(jQuery);

String.prototype.trimStart = function(trimStr){ 
if(!trimStr){return this;} 
var temp = this; 
while(true){ 
if(temp.substr(0,trimStr.length)!=trimStr){ 
break; 
} 
temp = temp.substr(trimStr.length); 
} 
return temp; 
}; 
String.prototype.trimEnd = function(trimStr){ 
if(!trimStr){return this;} 
var temp = this; 
while(true){ 
if(temp.substr(temp.length-trimStr.length,trimStr.length)!=trimStr){ 
break; 
} 
temp = temp.substr(0,temp.length-trimStr.length); 
} 
return temp; 
}; 
String.prototype.trim = function(trimStr){ 
var temp = trimStr; 
if(!trimStr){temp=" ";} 
return this.trimStart(temp).trimEnd(temp); 
}; 
String.format = function () { 
if (arguments.length == 0) { 
return null; 
} 
var str = arguments[0]; 
for (var i = 1; i < arguments.length; i++) { 
var re = new RegExp('\\{' + (i - 1) + '\\}', 'gm'); 
str = str.replace(re, arguments[i]); 
} 
return str; 
} 
(function ($j) { 
$j.util = { 
_compareTagName : function (item, tagName) { 
return item.attr("tagName").toUpperCase() == tagName.toUpperCase(); 
}, isTable: function (item) { 
return $j.util._compareTagName(item, "TABLE"); 
}, 
isDiv: function (item) { 
return $j.util._compareTagName(item, "DIV"); 
}, 
isInput: function (item) { 
return $j.util._compareTagName(item, "INPUT"); 
}, 
isSpan: function (item) { 
return $j.util._compareTagName(item, "SPAN"); 
}, 
isLi: function (item) { 
return $j.util._compareTagName(item, "LI"); 
}, 
isTD: function (item) { 
return $j.util._compareTagName(item, "TD"); 
} 
}; 
})(jQuery);
Javascript 相关文章推荐
jquery $.ajax入门应用一
Nov 19 Javascript
JS URL传中文参数引发的乱码问题
Sep 02 Javascript
JS编程小常识很有用
Nov 26 Javascript
Jquery中ajax方法data参数的用法小结
Feb 12 Javascript
深入理解jQuery之防止冒泡事件
May 24 Javascript
Node.js的Mongodb使用实例
Dec 30 Javascript
jQuery基于ajax操作json数据简单示例
Jan 05 Javascript
AngularJS改变元素显示状态
Apr 20 Javascript
浅谈angular4 ng-content 中隐藏的内容
Aug 18 Javascript
AngularJS ui-router刷新子页面路由的方法
Jul 23 Javascript
javascript实现简易的计算器
Jan 17 Javascript
jQuery实现的上拉刷新功能组件示例
May 01 jQuery
最短的IE判断代码
Mar 13 #Javascript
javascript模拟的Ping效果代码 (Web Ping)
Mar 13 #Javascript
js中巧用cssText属性批量操作样式
Mar 13 #Javascript
js中获取事件对象的方法小结
Mar 13 #Javascript
js中关于new Object时传参的一些细节分析
Mar 13 #Javascript
重载toString实现JS HashMap分析
Mar 13 #Javascript
JavaScript获取页面上某个元素的代码
Mar 13 #Javascript
You might like
自己做矿石收音机
2021/03/02 无线电
php中文件上传的安全问题
2006/10/09 PHP
如何跨站抓取别的站点的页面的补充
2006/10/09 PHP
自己前几天写的无限分类类
2007/02/14 PHP
yii操作session实例简介
2014/07/31 PHP
Laravel5.* 打印出执行的sql语句的方法
2017/07/24 PHP
PHP钩子实现方法解析
2019/05/21 PHP
Jquery 一次处理多个ajax请求的代码
2011/09/02 Javascript
JavaScript 模式之工厂模式(Factory)应用介绍
2012/11/15 Javascript
jQuery实现自动切换播放的经典滑动门效果
2015/09/12 Javascript
JS使用ActiveXObject实现用户提交表单时屏蔽敏感词功能
2017/06/20 Javascript
json数据传到前台并解析展示成列表的方法
2018/08/06 Javascript
基于element-ui的rules中正则表达式
2018/09/04 Javascript
JavaScript实现随机点名程序
2020/03/25 Javascript
js实现简单的贪吃蛇游戏
2020/04/23 Javascript
[34:44]Liquid vs TNC Supermajor 胜者组 BO3 第二场 6.4
2018/06/05 DOTA
[01:57]2018年度DOTA2最具潜力解说-完美盛典
2018/12/16 DOTA
Python Trie树实现字典排序
2014/03/28 Python
python去除文件中空格、Tab及回车的方法
2016/04/12 Python
python计算阶乘和的方法(1!+2!+3!+...+n!)
2019/02/01 Python
解决pycharm下os.system执行命令返回有中文乱码的问题
2019/07/07 Python
Django 全局的static和templates的使用详解
2019/07/19 Python
Python编写万花尺图案实例
2021/01/03 Python
Raffaello Network德国:意大利拉斐尔时尚购物网
2019/05/01 全球购物
安全资料员岗位职责范本
2014/06/28 职场文书
2014离婚协议书范文两篇
2014/09/15 职场文书
计算机专业自荐信
2015/03/05 职场文书
2015年物业管理工作总结
2015/04/23 职场文书
2015年党风廉政建设目标责任书
2015/05/08 职场文书
2016大学生国家助学贷款承诺书
2016/03/25 职场文书
个人工作总结怎么写?
2019/04/09 职场文书
2019公司借款合同范本2篇!
2019/07/24 职场文书
当你焦虑迷茫时,请读读这6句话
2019/07/24 职场文书
python基础之爬虫入门
2021/05/10 Python
maven依赖的version声明控制方式
2022/01/18 Java/Android
恶魔之树最顶端的三颗果实 震震果实上榜,第一可以制造岩浆
2022/03/18 日漫