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如何实现在加载完iframe的内容后再进行操作
Sep 10 Javascript
jquery toolbar与网页浮动工具条具体实现代码
Jan 12 Javascript
Bootstrap基础学习
Jun 16 Javascript
js中substr,substring,indexOf,lastIndexOf,split,replace的用法详解
Nov 09 Javascript
jquery实现可旋转可拖拽的文字效果代码
Jan 27 Javascript
jquery层级选择器的实现(匹配后代元素div)
Sep 05 Javascript
Javascript中常用的检测方法小结
Oct 08 Javascript
jquery实现文本框的禁用和启用
Dec 07 Javascript
JS敏感词过滤代码
Dec 23 Javascript
浅谈vue项目4rs vue-router上线后history模式遇到的坑
Sep 27 Javascript
vue中实现点击按钮滚动到页面对应位置的方法(使用c3平滑属性实现)
Dec 29 Javascript
详解Vue的sync修饰符
May 15 Vue.js
最短的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
WordPress自定义时间显示格式
2015/03/27 PHP
phpStudy 2016 使用教程详解(支持PHP7)
2017/10/18 PHP
PHP实现数组的笛卡尔积运算示例
2017/12/15 PHP
详解PHP的抽象类和抽象方法以及接口总结
2019/03/15 PHP
laravel框架上传图片实现实时预览功能
2019/10/14 PHP
PHP 实现缩略图
2021/03/09 PHP
使用CSS3实现字体颜色渐变的实现
2021/03/09 HTML / CSS
动态调用CSS文件的JS代码
2010/07/29 Javascript
jQuery UI的Dialog无法提交问题的解决方法
2011/01/11 Javascript
jQuery Mobile框架中的表单组件基础使用教程
2016/05/17 Javascript
Javascript类型系统之undefined和null浅析
2016/07/13 Javascript
基于Javascript实现文件实时加载进度的方法
2016/10/12 Javascript
详解照片瀑布流效果(js,jquery分别实现与知识点总结)
2017/01/01 Javascript
Bootstrap3 多个模态对话框无法显示的解决方案
2017/02/23 Javascript
vue与TypeScript集成配置最简教程(推荐)
2017/10/17 Javascript
浅谈mint-ui loadmore组件注意的问题
2017/11/08 Javascript
Python自定义函数的创建、调用和函数的参数详解
2014/03/11 Python
Python使用Flask框架获取当前查询参数的方法
2015/03/21 Python
Python数据类型中的“冒号“[::]——分片与步长操作示例
2018/01/24 Python
对django的User模型和四种扩展/重写方法小结
2019/08/17 Python
Django自带日志 settings.py文件配置方法
2019/08/30 Python
Bootstrap 学习分享
2012/11/12 HTML / CSS
Saucony澳大利亚官网:美国跑鞋品牌,运动鞋中的劳斯莱斯
2018/05/05 全球购物
Linux不知道文件后缀名怎么判断文件类型
2014/08/21 面试题
机电专业体育教师求职信
2013/09/21 职场文书
应届护士推荐信
2013/11/16 职场文书
初中升旗仪式演讲稿
2014/05/08 职场文书
社区戒毒工作方案
2014/06/04 职场文书
2014年监理工作总结范文
2014/11/17 职场文书
安阳殷墟导游词
2015/02/10 职场文书
个人年度总结报告
2015/03/09 职场文书
师范生见习自我总结
2015/06/23 职场文书
团队执行力培训心得体会
2015/08/15 职场文书
《游戏公平》教学反思
2016/02/20 职场文书
班干部竞选演讲稿(精选5篇)
2019/09/24 职场文书
修改MySQL的数据库引擎为INNODB的方法
2021/05/26 MySQL