jQuery前台数据获取实现代码

所属分类: 网络编程 / JavaScript 阅读数: 462
收藏 0 赞 0 分享
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);
更多精彩内容其他人还在看

jQuery LigerUI 使用教程表格篇(1)

ligerGrid是ligerui系列插件的核心控件,用户可以快速地创建一个美观,而且功能强大的表格,支持排序、分页、多表头、固定列等等
收藏 0 赞 0 分享

JavaScript中常用的运算符小结

JavaScript中常用的运算符小结,需要的朋友可以参考下。
收藏 0 赞 0 分享

深入理解JavaScript系列(13) This? Yes,this!

在这篇文章里,我们将讨论跟执行上下文直接相关的更多细节。讨论的主题就是this关键字。实践证明,这个主题很难,在不同执行上下文中this的确定经常会发生问题
收藏 0 赞 0 分享

javascript (用setTimeout而非setInterval)

javascript (用setTimeout而非setInterval)如果用setInterval 可能出现 下次调用会在前一次调用前调用
收藏 0 赞 0 分享

JavaScript中两个感叹号的作用说明

用两个感叹号的作用就在于,如果明确设置了o中flag的值(非null/undefined/0""/等值),自然test就会取跟o.flag一样的值;如果没有设置,test就会默认为false,而不是null或undefined
收藏 0 赞 0 分享

javascript写的简单的计算器,内容很多,方法实用,推荐

最近用javascript写了一个简单的计算器,自己测试感觉还好,代码都给了注释,非常不错,推荐大家学习。
收藏 0 赞 0 分享

js的表单操作 简单计算器

javascript写的简单的加减乘除计算器,里面涉及到一些方法还是很实用的哦,新手不要错过
收藏 0 赞 0 分享

Jquery中删除元素的实现代码

empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除
收藏 0 赞 0 分享

javaScript 利用闭包模拟对象的私有属性

JavaScript缺少块级作用域,没有private修饰符,但它具有函数作用域。作用域的好处是内部函数可以访问它们的外部函数的参数和变量(除了this和argument
收藏 0 赞 0 分享

为JavaScript类型增加方法的实现代码(增加功能)

大家在js开发过程中有些功能已经满足不了我们的需求,或没有我们需要的功能,那么我们就可以自己扩展下,个性化js
收藏 0 赞 0 分享
查看更多