搜索
查看
编辑修改
首页
UNITY
NODEJS
PYTHON
AI
GIT
PHP
GO
CEF3
JAVA
HTML
CSS
搜索
小丑西瓜9
这个屌丝很懒,什么也没留下!
关注作者
热门标签
jquery
HTML
CSS
PHP
ASP
PYTHON
GO
AI
C
C++
C#
PHOTOSHOP
UNITY
iOS
android
vue
xml
爬虫
SEO
LINUX
WINDOWS
JAVA
MFC
CEF3
CAD
NODEJS
GIT
Pyppeteer
article
热门文章
1
雷达恒虚警处理matlab_雷达信号处理基础之【恒虚警处理】
2
AIGC提示词(Prompt)网站_aigc提示词网站
3
华为OD机试真题-围棋的气-2023年OD统一考试(C卷)---python代码_华为题"围棋的气"python答案
4
Ubuntu22.04 安装显卡驱动+CUDA_ubuntu22.04安装cuda
5
android manifest.xml中的meta-data属性
6
【六种方案】【idea】最全解决IntelliJ IDEA控制台输出中文乱码问题_idea控制台输出中文乱码怎么解决
7
【研发日记】Matlab/Simulink技能解锁(八)——分布式仿真
8
AIGC 010-CLIP第一个文本和图像对齐的大模型!
9
裁员来临前有什么征兆,如何应对被裁员?_有预感被裁该准备些什么
10
以gitee码云和vscode为例进行多人协作开发_vscode多人协作
当前位置:
article
> 正文
使用js在table中添加一行_js怎么table中间插入一行
作者:小丑西瓜9 | 2024-06-03 20:58:14
赞
踩
js怎么table中间插入一行
//添加拦截点
$("#J_add").on("click",function(){
var table =document.getElementById("J_tab");
var num = table.rows.length;
var A_tr = '<tr id="intereceptTr'+num+'"><td width="50" class="tab_cen border_down">'+num+'</td><td class="tab_cen border_down"><div class="form-group"><input id="intereceptMethod'+num+'" name="intereceptMethod'+num+'" type="text" class="inter_input"/></div></td><td width="200" class="tab_cen border_down"><a href="#" class="tablelink" οnclick="deltr(\'intereceptTr'+num+'\')">删除</a></td></tr>';
$("#J_tab").append(A_tr);
//验证
$("#intereceptMethod"+num).rules("add", {
required: true,
maxlength: 200,
messages: {
required: "请设置拦截点"
}
});
});
<div class="intergral_tit clearfix"><p>拦截点设置</p><span id="J_add"><a href="#">添加拦截点</a></span></div>
<div class="intergral_tab">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablelist" id="J_tab">
<tbody>
<tr>
<th width="50" class="tab_cen">序号</th>
<th class="tab_cen">拦截点</th>
<th width="200" class="tab_cen">操作</th>
</tr>
</tbody>
</table>
//****************************************************************************************************************************
//另外一种写法
var row_num = ${empty templateInfo.templateParamInfos?1:fn:length(templateInfo.templateParamInfos)};
function addTemplateParamRow(){
var $paramCode = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="paramCode'+row_num+'" validate="{required:true,maxlength:20,codeValid:true}"></div></td>');
var $paramName = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="paramName'+row_num+'" validate="{required:true,maxlength:20}"></div></td>');
var $defaultValue = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="defaultValue'+row_num+'" validate="{maxlength:20}"></div></td>')
var $mark = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="mark'+row_num+'" validate="{maxlength:50}"></div></td>')
var $delRow = $('<td class="tab_cen border_down"><a href="javascript:void(0)" class="tablelink" οnclick="deleteRow(\'row_'+row_num+'\')">删除</a></td>')
var $tr=$('<tr id="row_'+row_num+'"></tr>');
$tr.append($paramCode);
$tr.append($paramName);
$tr.append($defaultValue);
$tr.append($mark);
$tr.append($delRow);
$("#param_tbody").append($tr);
row_num++;
}
<div class="tab_height">
<table class="tablelist nobar">
<tbody id="param_tbody">
<c:forEach items="${templateInfo.templateParamInfos}" var="ti" varStatus="vs">
<tr id="row_${vs.index }">
<td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="paramCode${vs.index }" value="${ti.paramCode }" validate="{required:true,maxlength:20,codeValid:true}"></div></td>
<td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="paramName${vs.index }" value="${ti.paramName }" validate="{required:true,maxlength:20}"></div></td>
<td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="defaultValue${vs.index }" value="${ti.defaultValue }" validate="{maxlength:20}"></div></td>
<td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="mark${vs.index }" value="${ti.mark }" validate="{maxlength:50}"></div></td>
<td class="tab_cen"><a href="javascript:void(0)" class="tablelink" οnclick="deleteRow('row_${vs.index }')">删除</a></td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
声明:
本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:
https://www.wpsshop.cn/w/小丑西瓜9/article/detail/668894
推荐阅读
article
【
bug
】【
vue
+
el
-
table
】
数据
重绘,刷新
数据
(
组件
嵌套较深
,
数据
结构包含
children
...
这个
bug
应该不是
组件
嵌套过深的原因
,
而是新增的时候没有加
children
,
组件
的渲染依赖于特定的
数据
结构或状态
,
利用索...
赞
踩
article
添加唯一性约束 延迟生效_表存在数据时
alter
table
add
constraint
usi...
已存在数据的表,发现某字段缺失唯一性约束,现在要添加唯一性约束,操作如下:-- 添加唯一性约束,延迟生效
alter
ta...
赞
踩
article
Latex
表格
制作详细教程(
table
,
tabular
,
multirow
, multicolum...
Latex
表格
制作超详细教程_
latex
表格
latex
表格
...
赞
踩
article
hive
在执行
create
table
student
1
as
select
*
from
stu...
_
hive
create
table
as
select
很慢
hive
create
table
as
select
很...
赞
踩
article
HBase
优化之Apache
Phoenix
二级
索引
_
skip
-
scan
-
join
table
0...
索引
分类全局
索引
本地
索引
覆盖
索引
函数
索引
全局
索引
全局
索引
适用于读多写少业务 当构建了全局
索引
时,
Phoenix
会拦截写入...
赞
踩
article
python
pivot
_
table
功能
详解与应用
--
实现
Excel
的透视表
功能
_
pivot
t...
1. 背景描述透视表是一种能对多维数据进行分析统计的工具,具有筛选处理、分类汇总,优化显示等强大的
功能
,是
Excel
中最...
赞
踩
article
【
Python
常用
函数
】一文让你彻底掌握
Python
中的
pivot
_
table
函数
_
python
p...
python
中的
pivot
_
table
函数
详解_
python
pivot
table
python
pivot
table
...
赞
踩
article
Pandas
数据透视表--
pivot
_
table
_
pivot
table
...
pandas有两个
pivot
_
table
函数,pandas.
pivot
_
table
和pandas.DataFrame.p...
赞
踩
article
【
MySQL
】
lower
_
case
_
table
_
names
作用及使用
_
lower
-
case
-tabl...
在使用dataease时,连接外部数据库,启动报错!后查看官方文档,特别要求改数据库配置文件:
lower
_
case
_
ta...
赞
踩
article
【
Flink
SQL
】
Flink
SQL
基础
概念
(一):
SQL
&
amp
;
Table
运行环境、...
无论输入是连续(流处理)还是有界(批处理),在
Table
和
SQL
任一
API
中同一条查询语句是具有相同的语义并...
赞
踩
article
Linux磁盘LVM根目录扩容
ubuntu
--vg-
ubuntu
--lv_
the
backup
gp...
扩展
ubuntu
--vg-
ubuntu
--lv。Linux磁盘LVM根目录扩容。The
backup
GPT
table
...
赞
踩
article
Kylin GPT PMBR 大小不符_
the
backup
gpt
table
is
not on...
GPT PMBR fd
is
k_
the
backup
gpt
table
is
not on
the
end of
the
...
赞
踩
article
【
数据结构
】
哈希
表(
Hash
Table
)...
【
数据结构
】
哈希
表(
Hash
Table
)_
哈希
表
哈希
表 文...
赞
踩
article
sqoop
使用,从
hive
向
oracle
导入数据_
sqoop
staging
-
table
的用法...
author: lf
sqoop
export 使用说明--export-dir 和 (--
table
和--call中的一...
赞
踩
article
纯JS
table
动态增加
行
_
js
table
添加
行
...
JS代码:function addRow(
table
Id) { var tb=document.getElementBy...
赞
踩
article
html5
表格自增
一行
添加
数据
,
bootstrap
table
insertRow
插入
一行
数据
的方法...
bootstrap
table
insertRow
插入
一行
数据
的方法通过
bootstrap
table
insertRo...
赞
踩
相关标签
bug
vue.js
数据结构
数据库
linux
前端
latex
表格
科研
论文写作
hive insert 报错
python
pandas
数据分析
mysql
database
flink
sql
大数据
ubuntu
运维
kylin
散列表
哈希算法