//ThArr表格的头数据，TdArr表格的单元格数据
|
function createTbl(ele,ThArr,TdArr){
|
ele.children('table').remove();
|
var _table=$('<table data-role="table" class="ui-responsive"></table>');
|
var _thead=$('<thead></thead>');
|
var _tbody=$('<tbody></tbody>');
|
var ThArray=new Array(); //设置th的数组
|
var TrArray=new Array(); //设置tr的数组
|
var TdArray=new Array(); //设置td的数组
|
var TdLength; //获取单元格个数
|
var TrLength; //获取行数
|
TdLength=TdArr.length;
|
TrLength=Math.ceil(TdLength/ThArr.length);
|
// 给每个th设置值
|
for(var i=0;i<ThArr.length;i++)
|
{
|
ThArray[i]=$('<th>'+ThArr[i]+'</th>');
|
}
|
// 给每个td设置值
|
for(var i=0;i<TdLength;i++)
|
{
|
TdArray[i]=$("<td>"+TdArr[i]+"</td>");
|
}
|
|
//设置tr
|
for(var i=0;i<TrLength;i++)
|
{
|
TrArray[i]=$("<tr></tr>");
|
}
|
//将td以col个赋给tr
|
var n=0;
|
for(var i=0;i<TrLength;i++)
|
{
|
for(var k=0;k<ThArr.length;k++)
|
{
|
TrArray[i].append(TdArray[n]);
|
n++;
|
}
|
TrArray[i].append($('<td style="visibility: hidden"></td>'));
|
}
|
//给th赋给thead
|
var _tr = $('<tr></tr>');
|
for(var i=0;i<ThArr.length;i++)
|
{
|
_tr.append(ThArray[i]);
|
}
|
_tr.append($('<th style="visibility: hidden"></th>'));
|
_thead.append(_tr);
|
_table.append(_thead);
|
// 将tr赋给table
|
for(var i=0;i<TrLength;i++)
|
{
|
_tbody.append(TrArray[i]);
|
}
|
_table.append(_tbody);
|
//将table添加到指定的容器中
|
ele.append(_table).trigger('create');
|
}
|
|
// 创建非自适应表格
|
function createTblNoRes(ele,ThArr,TdArr){
|
ele.children('table').remove();
|
var _table=$('<table style="text-align:center;"></table>');
|
var _thead=$('<thead></thead>');
|
var _tbody=$('<tbody></tbody>');
|
var ThArray=new Array(); //设置th的数组
|
var TrArray=new Array(); //设置tr的数组
|
var TdArray=new Array(); //设置td的数组
|
var TdLength; //获取单元格个数
|
var TrLength; //获取行数
|
TdLength=TdArr.length;
|
TrLength=Math.ceil(TdLength/ThArr.length);
|
// 给每个th设置值
|
for(var i=0;i<ThArr.length;i++)
|
{
|
ThArray[i]=$('<th>'+ThArr[i]+'</th>');
|
}
|
// 给每个td设置值
|
for(var i=0;i<TdLength;i++)
|
{
|
TdArray[i]=$("<td>"+TdArr[i]+"</td>");
|
}
|
|
//设置tr
|
for(var i=0;i<TrLength;i++)
|
{
|
TrArray[i]=$("<tr></tr>");
|
}
|
//将td以col个赋给tr
|
var n=0;
|
for(var i=0;i<TrLength;i++)
|
{
|
for(var k=0;k<ThArr.length;k++)
|
{
|
TrArray[i].append(TdArray[n]);
|
n++;
|
}
|
}
|
//给th赋给thead
|
var _tr = $('<tr></tr>');
|
for(var i=0;i<ThArr.length;i++)
|
{
|
_tr.append(ThArray[i]);
|
}
|
_thead.append(_tr);
|
_table.append(_thead);
|
// 将tr赋给table
|
for(var i=0;i<TrLength;i++)
|
{
|
_tbody.append(TrArray[i]);
|
}
|
_table.append(_tbody);
|
//将table添加到指定的容器中
|
ele.append(_table).trigger('create');
|
}
|
/**
|
向表格内添加数据
|
@param object ele jquery对象表格容器
|
@param array ThArr 表格头部数据
|
@param array TdArr 表格数据
|
*/
|
function addTrToTbl(ele, ThArr, TdArr) {
|
var _table=$('<table data-role="table" class="ui-responsive"></table>');
|
var _thead=$('<thead></thead>');
|
var _tbody=$('<tbody></tbody>');
|
var ThArray=new Array(); //设置th的数组
|
var TrArray=new Array(); //设置tr的数组
|
var TdArray=new Array(); //设置td的数组
|
var TdLength; //获取单元格个数
|
var TrLength; //获取行数
|
TdLength=TdArr.length;
|
TrLength=Math.ceil(TdLength/ThArr.length);
|
// 给每个th设置值
|
for(var i=0;i<ThArr.length;i++)
|
{
|
ThArray[i]=$('<th>'+ThArr[i]+'</th>');
|
}
|
// 给每个td设置值
|
for(var i=0;i<TdLength;i++)
|
{
|
TdArray[i]=$("<td>"+TdArr[i]+"</td>");
|
}
|
|
//设置tr
|
for(var i=0;i<TrLength;i++)
|
{
|
TrArray[i]=$("<tr></tr>");
|
}
|
//将td以col个赋给tr
|
var n=0;
|
for(var i=0;i<TrLength;i++)
|
{
|
for(var k=0;k<ThArr.length;k++)
|
{
|
TrArray[i].append(TdArray[n]);
|
n++;
|
}
|
TrArray[i].append($('<td style="visibility: hidden"></td>'));
|
}
|
//给th赋给thead
|
var _tr = $('<tr></tr>');
|
for(var i=0;i<ThArr.length;i++)
|
{
|
_tr.append(ThArray[i]);
|
}
|
_tr.append($('<th style="visibility: hidden"></th>'));
|
_thead.append(_tr);
|
_table.append(_thead);
|
// 将tr赋给table
|
for(var i=0;i<TrLength;i++)
|
{
|
_tbody.append(TrArray[i]);
|
}
|
_table.append(_tbody);
|
//将table添加到指定的容器中
|
ele.append(_table).trigger('create');
|
}
|
|
|
//显示加载器
|
function showLoader() {
|
//显示加载器.for jQuery Mobile 1.2.0
|
$.mobile.loading('show', {
|
text: '加载中...', //加载器中显示的文字
|
textVisible: true, //是否显示文字
|
theme: 'a', //加载器主题样式a-e
|
textonly: false, //是否只显示文字
|
html: "" //要显示的html内容，如图片等
|
});
|
}
|
|
//隐藏加载器.for jQuery Mobile 1.2.0
|
function hideLoader() {
|
//隐藏加载器
|
$.mobile.loading('hide');
|
}
|
|
// 判断是否显示翻页按钮
|
function setPageTurning(isShowPre, isShowNext) {
|
if(isShowPre) { // 判断是否显示向上翻页按钮
|
$('.pre-page').show();
|
}else {
|
$('.pre-page').hide();
|
}
|
|
if(isShowNext) { // 判断是否显示向下翻页按钮
|
$('.next-page').show();
|
}else {
|
$('.next-page').hide();
|
}
|
}
|
|
// 向页面中添加条使页面可以滚动
|
function addLongBar() {
|
if($('body').find('.long-bar').length == 0) {
|
var win_ht = $.mobile.getScreenHeight()+40;
|
var long_bar = $('<div class="long-bar"></div>');
|
long_bar.css({
|
'position': 'absolute',
|
'width': '10px',
|
'height': win_ht+'px',
|
'background-color': 'red'
|
});
|
$('body').append(long_bar);
|
}
|
}
|
|
$(function() {
|
$('.tbl-container').on('click', 'table tbody tr', function() {
|
$('.tbl-container table tbody tr').removeClass('active');
|
$(this).addClass('active');
|
});
|
});
|
|
//对mobile端数据表格进行操作
|
var MobileTbl = function(tbl, arrTh) {
|
this.tbl = tbl;
|
this.arrTh = arrTh;
|
};
|
|
// 定义对象的原型函数
|
MobileTbl.prototype = {
|
setArrTh:function(arrTh) { // 设置表格的头部数据
|
this.arrTh = arrTh;
|
}
|
,updateCell: function(rows, cols, value) { // 更新指定的单元格
|
var tbody = this.tbl.find('tbody'); // 获取tbody
|
var tr = tbody.find('tr').eq(rows); // 获取tr
|
var td = tr.find('td').eq(cols); // 获取td
|
var th = this.arrTh[cols]; // 列头部数据信息
|
|
// 生成html标记字符串
|
var tdHtml = '<b class="ui-table-cell-label">'+th+'</b>';
|
tdHtml += value;
|
|
// 添加内容到td
|
td.html(tdHtml);
|
}
|
};
|
