js 创建Table,每行3列的方式
table:
<table style="width:100%" id="appDatas"></table>
1.
var tables = [];
var len = data.length;
var rowNum = 3;
var sumRows = len % rowNum;
var sumRowMod = len / rowNum;
var rows = (sumRows == 0 ? sumRowMod : sumRowMod + 1);
for (var j = 0; j < rows; j++) {
var iLen = (j + 1) * rowNum;
iLen = iLen > len ? len : iLen
tables.push("<tr>");
for (var i = j * rowNum; i < iLen; i++) {
tables.push('<td><input type="checkbox" id="' + data[i].Id + '" value="' + data[i].Id
+ (data[i].isChecked == "1" ? '" checked="checked"' : '"') + ' name="appIds" /><label for="' + data[i].Id + '">'
+ data[i].Name + '</label></td>');
}
tables.push("</tr>");
}
$("#appDatas").html(tables.join(""));
2.
var tables = [];
var len = data.length;
var rowNum = 3;
for (var i = 0; i < len; i++) {
var j = i % rowNum
if ( j == 0) {
tables.push("<tr></tr>");
}
tables.push('<td><input type="checkbox" id="' + data[i].Id + '" value="' + data[i].Id
+ (data[i].isChecked == "1" ? '" checked="checked"' : '"') + ' name="appIds" /><label for="' + data[i].Id + '">'
+ data[i].Name + '</label></td>');
}
$("#appDatas").html(tables.join(""));
js 创建Table,每行3列的方式的更多相关文章
- js创建table表格
//js创建table表格var tr;var cell;for(var i=0;i<10;i++){ //创建一个tr tr=document.createElement('tr'); doc ...
- 9月6日表格标签(table、行、列、表头)(补)
一.<table> <table>代表表格标签. <table></table> 1.width 表示表格宽度,宽度表达方式有像素和百分比两种.网 ...
- 表格标签(table、行、列、表头)
表格标签 一.<table> <table>代表表格标签. <table></table> 1.width 表示表格宽度,宽度表达方式有像素和百分 ...
- js/jq动态创建表格的行与列
之前做了一个项目,需求是能动态创建表格行,动态创建表格的列,度了很多资料,都没有动态创建列的插件,所以自己动手写了一个 需求大概是(下图) 1.动态添加一行.2.动态添加一列,3.删除行.4.删除列, ...
- c# js 删除table原行数据
function addtreetotable(obj){ var table1 = document.getElementById("Table1"); var hang = ...
- MySQL,排序,统计行转列
表 -- ------------------------------ Table structure for a-- ---------------------------- DROP TABLE ...
- [转] js实现html table 行,列锁定
js实现html table 表头,指定列锁定 实现效果如下: 感兴趣的朋友可以直接复制出来运行看效果. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTM ...
- 【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数
一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...
- [Js/Jquery]table行转列
摘要 在使用ews调用exhange的收件箱的并在h5页面显示邮件详情的时候,因为返回的每封邮件的内容都是htmlbody,没有textbody.每封邮件又没什么规律,用正则表达式来匹配内容并不合适, ...
随机推荐
- Spring MVC基础知识整理➣环境搭建和Hello World
概述 Spring MVC属于SpringFrameWork的产品,采用Model-View-Controller进行数据交互,已经融合在Spring Web Flow里面.Spring 框架提供了构 ...
- 2018软工实践作业八之UML设计
1. 团队信息 队名:小白吃队 成员: 后敬甲 031602409 卢泽明 031602328 蔡文斌 031602301 葛亮 031602617 刘浩 031602423 黄泽 031602317 ...
- java抽象类详解
前言 在没讲抽象类之前 我们先来看看 final关键字 final 修饰符 可以修饰 类.属性.方法 修饰类时 表示该类不能被继承 其他特征 跟普通的类一样 修饰 属性时 表示 改属性不能改变 ...
- 2018牛客网暑假ACM多校训练赛(第四场)C Chiaki Sequence Reloaded (组合+计数) 或 数位dp
原文链接https://www.cnblogs.com/zhouzhendong/p/NowCoder-2018-Summer-Round4-C.html 题目传送门 - https://www.no ...
- P1433 吃奶酪 回溯法 优化
题目描述 房间里放着n块奶酪.一只小老鼠要把它们都吃掉,问至少要跑多少距离?老鼠一开始在(0,0)点处. 输入输出格式 输入格式: 第一行一个数n (n<=15) 接下来每行2个实数,表示第i块 ...
- day30 网络编程 之进程,线程,协程
进程点进去 线程点进去 协程点进去 什么是进程 进程(有时称为重量级进程)是一个执行中的程序.每个进程都拥有自己的地址空间.内存.数据栈以及其他用于跟踪执行的辅助数据.同一个程序执行两次,属于是两个不 ...
- 在 Wiki 标记中添加无序列表
项目:在 Wiki 标记中添加无序列表在编辑一篇维基百科的文章时,你可以创建一个无序列表,即让每个列表项占据一行,并在前面放置一个星号.但是假设你有一个非常大的列表,希望添加前面的星号.你可以在每一行 ...
- springboot拦截器中获取配置文件值
package com.zhx.web.interceptor; import com.zhx.util.other.IpUtil; import org.slf4j.Logger; import o ...
- 【python】数据库
No1: [SQLite] 插入 # 导入SQLite驱动: >>> import sqlite3 # 连接到SQLite数据库 # 数据库文件是test.db # 如果文件不存在, ...
- Effective Java 第三版——59. 熟悉并使用Java类库
Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...