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 相关文章推荐
js 模拟气泡屏保效果代码
Jul 10 Javascript
js中匿名函数的N种写法
Sep 08 Javascript
table行随鼠标移动变色示例
May 07 Javascript
jquery ztree实现下拉树形框使用到了json数据
May 14 Javascript
Node.js实用代码段之正确拼接Buffer
Mar 17 Javascript
JavaScript学习笔记之创建对象
Mar 25 Javascript
jquery实现tab选项卡切换效果(悬停、下方横线动画位移)
May 05 jQuery
vue中七牛插件使用的实例代码
Jul 28 Javascript
axios异步提交表单数据的几种方法
Aug 11 Javascript
解决vue组件中click事件失效的问题
Nov 09 Javascript
JavaScript中的this妙用实例分析
May 09 Javascript
Vant picker 多级联动操作
Nov 02 Javascript
最短的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
php实现的仿阿里巴巴实现同类产品翻页
2009/12/11 PHP
PHP的基本常识小结
2013/07/05 PHP
php实现无限级分类
2014/12/24 PHP
php利用array_search与array_column实现二维数组查找
2019/07/08 PHP
jquery 图片 上一张 下一张 链接效果(续篇)
2010/04/20 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
2011/03/28 Javascript
在IE和VB中支持png图片透明效果的实现方法(vb源码打包)
2011/04/01 Javascript
Javascript中查找不以XX字符结尾的单词示例代码
2013/10/15 Javascript
jquery解析xml字符串简单示例
2014/04/11 Javascript
js使用for循环查询数组中是否存在某个值
2014/08/12 Javascript
jQuery使用CSS()方法给指定元素同时设置多个样式
2015/03/26 Javascript
jQuery使用empty()方法删除元素及其所有子元素的方法
2015/03/26 Javascript
在javascript中随机数 math random如何生成指定范围数值的随机数
2015/10/21 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
使用jQuery和ajax代替iframe的方法(详解)
2017/04/12 jQuery
webpack配置导致字体图标无法显示的解决方法
2018/03/06 Javascript
javascript canvas API内容整理
2020/02/16 Javascript
python监控进程脚本
2018/04/12 Python
使用 Python 实现简单的 switch/case 语句的方法
2018/09/17 Python
python 实现将txt文件多行合并为一行并将中间的空格去掉方法
2018/12/20 Python
python3实现小球转动抽奖小游戏
2020/04/15 Python
python实现关闭第三方窗口的方法
2019/06/28 Python
基于Python中isfile函数和isdir函数使用详解
2019/11/29 Python
python 数据类型强制转换的总结
2021/01/25 Python
CSS3的resize属性使用初探
2015/09/27 HTML / CSS
新秀丽官方旗舰店:Samsonite拉杆箱、双肩包、皮具
2018/03/05 全球购物
业务主管岗位职责
2013/11/20 职场文书
小学教师管理制度
2014/01/18 职场文书
幼儿园教师工作制度
2014/01/22 职场文书
汽车促销活动方案
2014/03/31 职场文书
环保小标语
2014/06/13 职场文书
师德师风剖析材料
2014/09/30 职场文书
2014年财务个人工作总结
2014/12/08 职场文书
违纪检讨书范文
2015/01/27 职场文书
tensorflow学习笔记之tfrecord文件的生成与读取
2021/03/31 Python
Css预编语言及区别详解
2021/04/25 HTML / CSS