js如何获取table中动态生成的数据

react+antd根据日期选择器,动态生成日期表格表头 思路:根据周选择器可以拿到当前选中日期,根据当前选中日期计算出这周的周一到周日,在列表的columns中添加周一到周日的列数据。 阅读详情

今天又学一招,多谢莉妹啦。

js如下:

$('#labe-table tr td #attrcode').each(function () {
        alert($(this).val());
});

页面如下:

<table id="labe-table" class="labe-table" cellspacing="0" cellpadding="0" style="display: none">
    <tbody>
    <tr>
        <th>参数编码</th>
        <th>参数名称</th>
        <th>单位(分钟)</th>
        <th>单价(元)</th>
        <th>备注</th>
        <th>单位类型</th>
        <th></th>
        <th></th>
    </tr>
    <tr>
        <td><input type="text" class="labe-text" id="attrcode" name="attrcode" value=""></td>
        <td><input type="text" class="labe-text" id="attrname" name="attrname" value=""></td>
        <td><input type="text" class="labe-text" id="attrunit" name="attrunit" value=""></td>
        <td><input type="text" class="labe-text" id="attrvalue" name="attrvalue" value=""></td>
        <td><input type="text" class="labe-text" id="remark1" name="remark1" value=""></td>
        <td><select class="labe-text" id="attrunittype" name="attrunittype" value=""><option>分钟</option><option>月</option></select></td>
        <td><input type="button" class="labe-btn" value="增加" onclick="addRow()"></td>
    </tr>
    </tbody>
   		 <tr>
			<td colspan="2" class="list-cen">
                <input type="button" class="btn-query" value="增加" onclick="save()">    
                <input type="button" class="btn-query" value="返回" onclick="javascript:history.go(-1)">
			</td> 
  		  </tr>  
</table>

       table中的行数是动态的,不是说一定就会有多少行多少行的,所以,这边使用的是juery的each()方法,对table的第一列进行遍历,后面将遍历的结果传入集合中去。

读取json数据动态生成table 用js加载json数据,然后用table显示。 立即下载

相关推荐

js动态添加表格逐行添加、删除、遍历取值的实例代码

最近做项目遇到这样的需求,要求表格添加一行,表格删除一行,表格遍历取值等。下面小编给大家带来了js动态添加表格逐行添加、删除、遍历取值的实例代码,需要的朋友参考下

原生js实现动态数据表格

js基础,实现动态表格,轻松易懂的必学小demo

wsdshdhdhd的博客 3109

PostgreSQL+Citus分布式集群实战:从零搭建到性能调优

本文详细介绍了如何从零开始搭建并优化PostgreSQL+Citus分布式数据库集群。内容涵盖集群规划、源码编译安装、Citus扩展部署、节点配置、分布式表创建以及核心性能调优策略,为应对海量数据增长提供了完整的部署指南和实战解决方案。

oo7890的博客 627

JS获取动态添加的元素

在页面的渲染中,我们经常用遇到动态添加的DOM元素,那么在获取这些元素的时候或则为这些DOM元素的时候,我们有下面三种处理方法: // 1. 在模板引擎里面添加行内事件 // 2. 利用事件的委托获取(常用) // 3. 在ajax的监听响应完成函数后面获取 一 在模板引擎里面添加行内事件 添加行内事件就是在标签里面添加事件,这样就可以直接获取到动态添加的元素. &lt;!-- 1.准...

weixin_42839080的博客 1万+

银河麒麟系统下VSCode安装全攻略:从下载到桌面快捷方式(附常见问题解决)

本文详细介绍了在银河麒麟系统下安装和优化VSCode的全流程,包括环境准备、安装策略、权限管理、桌面快捷方式创建以及系统级性能调优。特别针对国产系统环境提供了常见问题解决方案和必备插件推荐,帮助开发者高效配置开发环境。

v6b7n8m9q0的博客 1133

Windows游戏玩家必看:用Process Lasso优化CPU优先级和核心绑定,告别卡顿

本文为Windows游戏玩家详细介绍了如何使用Process Lasso优化系统性能。通过设置CPU优先级和核心绑定,可以智能管理进程资源,确保游戏获得最高调度权限,有效减少因后台程序干扰或Windows调度机制不完善导致的卡顿与帧数波动,从而提升游戏流畅度与稳定性。

weixin_29299807的博客 2217

有关动态获取jsp页面中table的总条数

当你想要获取jsp table中总条数传到后台时,其实并不需要从前端获取; 因为总条数是从后台传过去的,那么只要找到后台获取总条数的方法就可以解决了; 例如:

雨陆聪辰的博客 1801

单片机按键识别篇---单击---双击----长按

  最近做一任务需要使用一个按键实现三种功能,分别是按键单击功能,按键双击功能和按键长按功能,可能之前没有接触过这类按键复用情况,顶多也只是简单识别单击和长按,没有想过双击以上按键功能,也是绞尽脑汁,想了半天,又上网看了些例程,算是对于按键的识别有点小小的了解,感觉这个功能挺实用,在此做个随笔。 一、思路   1.识别长按操作思路:我们使用系统定时器定时,然后让系统每过一段时间去扫描按键I/O...

weixin_30311605的博客 3660

js对table的动态操作

一、js动态生成、删除tr 在页面的操作中,我们往往会对table进行操作,例如增加一行,删除一行。查过好多资料,有好多方法。在具体实践中,我所涉及的需求是: 通过对js方法add()传参数,然后把参数按照顺序分别具体的自动添加在所tr上,然后点击tr的“删除”button来出发moveTr()对这一行进行删除操作。 具体代码如下,仅供参考: //增加table中的“tr”,并给“td”赋...

weixin_33806914的博客 267

机器人控制基础:伺服驱动器的泄放电阻

摘要:伺服驱动器泄放电阻用于消耗电机减速或制动时产生的再生电能,防止母线电压过高损坏元件。其核心作用是将多余电能转化为热能,规避硬件损坏和停机风险。选型需关注功率、阻值和封装三大参数,功率应匹配再生能量,阻值需符合驱动器要求,封装应满足散热需求。可通过动态监测母线电压或静态检测电阻阻值来判断其是否正常工作。

start_up_go的博客 381

【NVMEM子系统】二、NVMEM驱动框架

该子系统整体架构不算太大,还是比较容易去理解的,下面我们一起去一探究竟!,该子系统主要用于实现EEPROMEfuse等非易失存储器的统一管理。在早期,像EEPROM驱动是存放于目录下,由于没有做到好的抽象,每次需要去访问相应内存空间,都需要去复制几乎一样的代码,去注册sysfs,这是一个相当大的抽象泄露。NVMEM子系统就是为了解决以往的抽象泄露问题。

Donge's Blog 1714

bootstrapTable 数据绑定和修改列

哈喽!介绍下bootstrapTable怎么绑定和列里添加按钮首先要引用css样式 <link href="~/Content/XSSSPGYPY/assets/bootstrap/css/bootstrap.min.css" rel="stylesheet" /> <link href="~/Content/XSSSPGYPY/assets/bootstrap/css/bootstr

HuChaoQing的博客 2万+

基于C++和Qt开发IEC104规约主站调试软件(第二章)

本章节主要讲解iec104主站软件界面设计和从站的连接功能以及部分功能代码的展示。

半青年的博客 858

js 将json数据自动绑定到 html table 表格中

/*自動綁定到table*/ var f = new Function("+[{id:"1",name:"aa"},{id:"2",name:"bb"}]+"); var list = f(); var h= ""; h+= "" for(var headColumn in list[0]){ h+=""+headColumn+"" } h+="""; for(var i=0;i<list.l

松龄的专栏 1万+

AUTOSAR&UDS 理论要点及isolar实战-DEM模块

从这节开始,将讲解UDS诊断中非常重要的知识点:故障事件触发、故障信息上报、故障信息处理、故障信息存储和故障系统降级,后续会陆续更新。

cqaa11的博客 552

WINCC7.3破解文件

WINCC7.3硬件够破解文件,有需要的下载!WINCC7.3硬件够破解文件,有需要的下载!

innerHTML动态生成table并进行数据填充

当我们需要动态生成table,并且这些数据没有绑定到页面中,只是一些临时获得的数据,那么这个时候要将这些数据放到table中,jstl的实现方式肯定已经不行了,那么这时候我们可以通过innerHTML来生成table并完成数据填充,以下给出详细的功能实现: var code = ''; var div1 = document.getElementById('tableId'); //我这...

Megamind_HL的博客 4201

IDEA的使用指南

IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.

bootstrap table php,Bootstrap Table使用方法详解

bootstrap-table使用总结bootstrap-table是在bootstrap-table的基础上写出来的,专门用于显示数据的表格插件。而bootstrap是来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,具有简便灵活,快速前端开发的优势。对与bootstrap在此就不在叙述。本文将着重讲解自己在项目中使用到boo...

weixin_42116705的博客 1400

android 蓝牙通讯demo

android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。

【element】 table 动态表头对应动态数据

【代码】【element】 table 动态表头对应动态数据。

maoxiaohei_的博客 995

自己做一个table插件 (一)Ajax获取数据后动态生成table

今天我给大家带来一个简单的JQ插件,Ajax获取数据后动态生成table。当然,有这种功能的插件有很多。著名的有DataTable、JqGrid……它们虽然功能丰富,成熟,拿来做二次开发是一个不错的选择。但是,我仍然自己写了一个插件,原因很简单,它们太庞大了,它的百分之九十的功能我都用不上。 下面是效果展示:我是用的AmazeUI做的当然,这都不重要,你只需要一个有Table标签的Html就可以了...

极客神殿 809

SPA项目开发之动态实现左侧菜单栏&分页查询功能

实现左侧树形菜单数据的绑定,以及文章列表分页查询功能...

qq_63492318的博客 548

javascript动态生成表格内容并设置属性,获取选中行的值

通过javascript 动态生成表格内容 test.asp用户维护         用户名称     手机号码-->     性别     用户类型       如何动态生成表格呢 见下面内容:var xPK, uName;clearData();SetData();var clicktablerownum=0;//晴空表格内容function clearData(){ for(

zuowei521的专栏 2855

bootstrap table用法小结

等等的功能。相关介绍请参考官方网址:http://bootstrap-table.wenzhixin.net.cn/ 二、这次项目中页面展示   三、使用方法 (1)引入js css &lt;link href="css/bootstrap/bootstrap.min.css" rel="stylesheet"&gt; &lt;link href="css/bootstrap/bootstrap-table.css&q

jiji0801的专栏 205

在循环遍历数据的表格中获取当行的数据

因为每一行的数据都是foreach出来的,所以如果定义其id号的话,那么每行都是一样的。 一、 原先的办法是定义一个num <%int num = 1;%>  然后在每个id后 xxx<%=num%> , 在foreach的最后<%num++;%> 这样得到的每行id都是不一样的,从而可以用jquery根据id号获取到每行的值。 但是这...

weixin_30533797的博客 484
上一篇: mysql查询上月的信息
下一篇: Git学习
self_defining
博客等级 码龄10年 31粉丝 82原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值