表格动态添加一行

最新推荐文章于 2022-02-08 20:52:40 发布
最新推荐文章于 2022-02-08 20:52:40 发布
阅读量260 收藏
点赞数
分类专栏： javaScript+AJAX 文章标签： JSP J# Web
<%@ page import="java.util.Date"%>
<%@ include file="/WEB-INF/jsp/common/taglibs.jsp" %>
<%@ taglib uri="/tlds/chooser.tld" prefix="chooser" %>
<%--<%@ include file="/WEB-INF/jsp/common/messages.jsp" %>--%>
<%@ page language="java" pageEncoding="GB2312" contentType="text/html;charset=utf-8" buffer="none"%>
<script type="text/javascript" src="<c:url value='/scripts/public.js'/>" charset="gb2312"></script>
<script language="javascript" src="<c:url value='/scripts/PopupCalendar.js'/>"></script>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title><bean:message key="market.letter.main.title"/></title>
<STYLE type=text/css>A:link {
COLOR: #000000; TEXT-DECORATION: none
}
A:visited {
COLOR: 5BBF04; TEXT-DECORATION: none
}
A:active {
COLOR: #85F127}
A:hover {
COLOR:E9730B; TEXT-DECORATION: none
}
TD {
COLOR: #000000; FONT-FAMILY: 宋体; FONT-SIZE: 9pt
}
</STYLE>
<script >

var oCalendarEn=new PopupCalendar("oCalendarEn"); //初始化控件时,请给出实例名称如:oCalendarEn
oCalendarEn.Init();


var oCalendarChs=new PopupCalendar("oCalendarChs"); //初始化控件时,请给出实例名称:oCalendarChs
oCalendarChs.weekDaySting=new Array("日","一","二","三","四","五","六");
oCalendarChs.monthSting=new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月");
oCalendarChs.oBtnTodayTitle="今天";
oCalendarChs.oBtnCancelTitle="取消";
oCalendarChs.Init();
</script>
<script language=javascript>
function addTableRow(tableName){
var table=document.all(tableName);
var rows=table.rows;
var rowcount=rows.length;
var rowN=rows.length+1;
// alert(rowN);
var centrow=table.insertRow(rowcount);
var cells=centrow.cells;
var cell0=rows(centrow.rowIndex).insertCell(cells.length);
var cell1=rows(centrow.rowIndex).insertCell(cells.length);
var cell2=rows(centrow.rowIndex).insertCell(cells.length);
var cell3=rows(centrow.rowIndex).insertCell(cells.length);
var cell4=rows(centrow.rowIndex).insertCell(cells.length);
var cell5=rows(centrow.rowIndex).insertCell(cells.length);
var cell6=rows(centrow.rowIndex).insertCell(cells.length);

cell2.align="center";
if(parseInt(rowcount)>8)
cell0.innerHTML='<label></label>&nbsp:<input type="checkbox" name="idArr"/> ';
else
cell0.innerHTML='<label></label> :<input type="checkbox" name="idArr"/> ';
cell1.innerHTML='<input type=text name="contents" />';
cell2.innerHTML='<input type=text name="targets" size="15" />';
cell3.innerHTML='<input type=text name="prompts" readOnly size="8" οnclick="getDateString(this,oCalendarChs)"/>';
cell4.innerHTML='<select name="taskLevels"><option value="1"><bean:message key="market.task.taskLevel1"/></option>'+
'<option value="2"><bean:message key="market.task.taskLevel2"/></option>'+
'<option value="3"><bean:message key="market.task.taskLevel3"/></option>' +
'<option value="4"><bean:message key="market.task.taskLevel4"/></option></select>';
cell5.innerHTML='<input type=text readOnly οnclick="return initSearch('+"'assortUsersN"+ rowN+"'"+','+"'assortUsers"+rowN+"'"+')" name="assortUsersN'+ rowN+'"/>'+
'<input type="hidden" name="assortUsers'+ rowN+'"/>';
/* '<a href="#" οnclick="return initSearch('+"'assortUsersN"+ rowN+"'"+','+"'assortUsers"+rowN+"'"+')">' +
'<bean:message key="enginechange.selectPeople"/></a>';*/
// alert('<input type=text name="assortUsersN'+ rowN+'"/>');
cell6.innerHTML='<input type=text name="remarks" size="15"/><html:hidden property="userIds" value=""/>'+
'<html:hidden property="schedules" value="0"/>'+
'<html:hidden property="evolves" value=""/>'+
'<html:hidden property="difficultys" value=""/>'+
'<html:hidden property="scheduleNos" value="0"/>'+
'<html:hidden property="addPlaces" value="0"/>';
cell0.children[0].innerHTML=rowcount+1;
}
function addRowWithContent(rowNum,content,target,prompt,taskLevel,assortUser,remark,userId,schedule,difficulty,scheduleNo,addPlace,evolve,assortUsersN){
addTableRow("dynamicTable");
var table=document.all("dynamicTable");
var rowCount=table.rows.length;
var cell=table.rows(rowCount-1).cells(0);
var obj=cell.children[0];
obj.innerHTML=rowNum+1;
cell=table.rows(rowCount-1).cells(1);
obj=cell.children[0];
obj.value=content;
cell=table.rows(rowCount-1).cells(2);
obj=cell.children[0];
obj.value=target;
cell=table.rows(rowCount-1).cells(3);
obj=cell.children[0];

obj.value=prompt;
cell=table.rows(rowCount-1).cells(4);
obj=cell.children[0];
obj.value=taskLevel;
cell=table.rows(rowCount-1).cells(5);
obj=cell.children[0];
obj.value=assortUsersN;
cell=table.rows(rowCount-1).cells(5);
obj=cell.children[1];
obj.value=assortUser;

cell=table.rows(rowCount-1).cells(6);
obj=cell.children[0];
obj.value=remark;

cell=table.rows(rowCount-1).cells(6);
obj=cell.children[1];
obj.value=userId;
cell=table.rows(rowCount-1).cells(6);
obj=cell.children[2];
obj.value=schedule;
cell=table.rows(rowCount-1).cells(6);
obj=cell.children[3];
obj.value=evolve;
cell=table.rows(rowCount-1).cells(6);
obj=cell.children[4];
obj.value=difficulty;
cell=table.rows(rowCount-1).cells(6);
obj=cell.children[5];
obj.value=scheduleNo;
cell=table.rows(rowCount-1).cells(6);
obj=cell.children[6];
obj.value=addPlace;


}

function removeElements(tableName){
var table=document.all(tableName);
var votedetailcheckboxs=document.all.idArr;
//only one
if(votedetailcheckboxs.tagName=="input"){

}
for(i=votedetailcheckboxs.length-1;i>=0;i--){
if(votedetailcheckboxs(i).checked){
table.rows(i).removeNode(true);
}
}
for(i=0;i<table.rows.length;i++){
var cell=table.rows(i).cells(0);
var obj=cell.children[0];
obj.innerHTML=i+1;
//------------------------------------------
//删除时动态修改配合人员属性名称：保证数据修改后录入正确：
cell=table.rows(i).cells(5);
obj=cell.children[0];
obj.name="assortUsersN"+(i+1);
// alert(obj.name);
cell=table.rows(i).cells(5);
obj=cell.children[1];
obj.name="assortUsers"+(i+1);
}
}
function save(){
var form = document.forms[0];
if(!validateForm(form))return;
form.action = "<c:url value="/task.do?method=save"/>";
form.submit();
}
function validateForm(form){
var table=document.all("dynamicTable");
var rowCount=table.rows.length;
var regex=/^\s*$/;
var cell1;
var taskDetailTitle;
for(var i=0;i<rowCount;i++){
cell1=table.rows(i).cells(1);
taskDetailTitle=cell1.children[0];
if(taskDetailTitle.value==null||taskDetailTitle.value==''||regex.test(taskDetailTitle.value)){
alert("<bean:message key='voteDetailTitle_required' />");
taskDetailTitle.focus();
return false;
}
}
return true;
}
function search(){
var form = document.forms[0];
form.action = "<c:url value="/task.do?method=add"/>";
form.submit();
}

function getSendUserId(userObj)
{
document.getElementById("assortUsersN").value = userObj[1];
document.getElementById("assortUsers").value = userObj[0];
}
function tjTask(){
var form = document.forms[0];
form.action = "<c:url value="/task.do?method=TjApprove"/>";
form.submit();
}
function back(){
var form = document.forms[0];
form.action = "<c:url value="/task.do?method=mainTask"/>";
form.submit();
}
function add(){
var form = document.forms[0];
form.action = "<c:url value="/task.do?method=add&menuId=187&sysId=2007041701"/>";
form.submit();
}
function gotoApprove(){
var form=document.forms[0];
form.action="<c:url value="/task.do?method=gotoApprove&menuId=190&sysId=2007041701"/>";
form.submit();
} function gotoComment(){
var form=document.forms[0];
form.action="<c:url value="/task.do?method=goComment&menuId=191&sysId=2007041701"/>";
form.submit();
}
function gotoSchedule(){
var form=document.forms[0];
form.action="<c:url value="/task.do?method=scheduleList&menuId=188&sysId=2007041701"/>";
form.submit();
}function gotoSummarize(){
var form=document.forms[0];
form.action="<c:url value="/task.do?method=summarize&menuId=189&sysId=2007041701"/>";
form.submit();
}
function gotoMemo()
{
var form=document.forms[0];
form.action="<c:url value="/task.do?method=gotoMemo&menuId=192&sysId=2007041701"/>";
form.submit();
}

function initSearch(eName, eId)
{
var form = document.forms['taskForm'];
var e = document.forms['taskForm'].all("type");
document.forms['taskForm'].all("type").value = '';
if(e != null)
{
window.showModalDialog("task.do?method=getGroupListByEmployee&retObj=type", window, 'dialogheight:450px;dialogwidth:350px;dialogleft:200px;dialogtop:200px;status:no;help:no');
var returnValue = document.forms['taskForm'].all("type").value;
if(returnValue != '')
{
var str = returnValue.split('@');

document.forms['taskForm'].all(eId).value = str[0];
document.forms['taskForm'].all(eName).value = str[1];
}
}
}
</script>


</head>


<body>
<jsp:include page="../../letter/marketContentTop.jsp"></jsp:include>

<html:form action="task.do?method=save" styleId="taskForm">
<html:hidden property="type"/>
<html:hidden property="sysId" value="${sysId}"/>
<html:hidden property="menuId" value="${menuId}"/>
<html:hidden property="tbMartTaskMonthly.monthlyId" value="${tbMartTaskMonthly.monthlyId}"/>
<html:hidden property="tbMartTaskMonthly.auditing" value="${tbMartTaskMonthly.auditing}"/>
<html:hidden property="tbMartTaskMonthly.leadComment" value="${tbMartTaskMonthly.leadComment}"/>
<html:hidden property="tbMartTaskMonthly.noSummarize" value="${tbMartTaskMonthly.noSummarize}"/>
<html:hidden property="tbMartTaskMonthly.auditingContent" value="${tbMartTaskMonthly.auditingContent}"/>
<html:hidden property="tbMartTaskMonthly.commentNum" value="${tbMartTaskMonthly.commentNum}"/>
<html:hidden property="tbMartTaskMonthly.commnetExplain" value="${tbMartTaskMonthly.commnetExplain}"/>

<table border="1" width="770" cellspacing="0" cellpadding="0">

<tr>
<td valign="top">

<!-------------------->

<tr>
<td width="100%" height="12" valign="top">
<table>
<tr>
<td colspan="7"valign="top" align="center">
<a href="#" οnclick="return add();" ><bean:message key="market.task.monthly"/></a>        
<a href="#" οnclick="return gotoSchedule();"><bean:message key="market.task.schUp"/></a>        
<a href="#" οnclick="return gotoSummarize();"><bean:message key="market.task.zj"/></a>        
<a href="#" οnclick="return gotoApprove();"><bean:message key="market.task.taskSh"/></a>        
<a href="#" οnclick="return gotoComment();"><bean:message key="market.task.taskKp"/></a>        
<a href="#" οnclick="return gotoMemo()"> <bean:message key="market.task.dsUp"/></a>

</td>
</tr>
<tr>
<td colspan="7" align="center"><strong><bean:message key="market.task.monthly"/></strong></td>
</tr>
<tr>

<td width="760" colspan="7" valign="top">
<strong><bean:message key="market.task.month"/></strong>
<select name="year">
<% String year=(String)request.getAttribute("year");
Date today=new Date();
for(int i=5;i>=1;i--){
String y2=Integer.toString(today.getYear()+1900-i);
// System.out.println("y2 "+y2+ "year"+year +" "+y2.toString().equals(year));
if(y2.toString().equals(year)){
%>
<option selected value="<%=today.getYear()+1900-i%>"><%=today.getYear()+1900-i%></option>
<%
}else{
%>
<option value="<%=today.getYear()+1900-i%>"><%=today.getYear()+1900-i%></option>
<% }
}
String y2=Integer.toString(today.getYear()+1900);
if(y2.equals(year)){
%>
<option selected value="<%=today.getYear()+1900%>"><%=today.getYear()+1900%></option>
<%
}else{
%>
<option value="<%=today.getYear()+1900%>"><%=today.getYear()+1900%></option>
<% }
for(int a=1;a<=5;a++){
y2=Integer.toString(today.getYear()+1900+a);
if(y2.equals(year)){
%>
<option selected value="<%=today.getYear()+1900+a%>"><%=today.getYear()+1900+a%></option>
<%}else{%>
<option value="<%=today.getYear()+1900+a%>"><%=today.getYear()+1900+a%></option>
<%}}%>
</select>
<bean:message key="market.letter.sendMartInfo.year"/>
<select name="month">
<%
String month=(String)request.getAttribute("month");
String m2="";
for(int j=today.getMonth();j>=1;j--){
m2=Integer.toString(today.getMonth()+1-j);
if(month.equals(m2)){
%>
<option selected value="<%=today.getMonth()+1-j %>" ><%=today.getMonth()+1-j %></option>
<%}else{%>
<option value="<%=today.getMonth()+1-j %>" ><%=today.getMonth()+1-j %></option>
<%}}%>
<%
m2=Integer.toString(today.getMonth()+1);
if(month.equals(m2)){
%>
<option selected value="<%=today.getMonth()+1%>"><%=today.getMonth()+1%></option>
<%}else{%>
<option value="<%=today.getMonth()+1%>"><%=today.getMonth()+1%></option>
<%}
for(int b=1;b<=12-(today.getMonth()+1);b++){
m2=Integer.toString(today.getMonth()+1+b);
if(month.equals(m2)){
%>
<option selected value="<%=today.getMonth()+1+b%>"><%=today.getMonth()+1+b%></option>
<%}else{ %>
<option value="<%=today.getMonth()+1+b%>"><%=today.getMonth()+1+b%></option>
<%} }%>

</select>
<bean:message key="market.letter.sendMartInfo.month"/>
    <input alt="<bean:message key="market.letter.marketing.search"/>" type="image" src="images/scjy/search.gif" id="image1" name="image1" WIDTH="22" HEIGHT="18" onClick="search();">
</td>
</tr>
<tr width="760" valign="top" height="12">
<td nowrap="true" width="50" valign="top" align="center"><strong><bean:message key="market.task.no"/></strong></td>
<td width="120" valign="top" align="center"><strong><bean:message key="market.task.content"/></strong></td>
<td width="90" valign="top" align="center"><strong><bean:message key="market.task.tarGet"/></strong></td>
<td width="70" valign="top" align="center"><strong><bean:message key="market.task.prompt"/></strong></td>
<td width="70"valign="top"align="center"><strong><bean:message key="market.task.taskLevel"/></strong></td>
<td nowrap="true" width="150" valign="top"align="center"><strong><bean:message key="market.task.assortUers"/></strong></td>
<td width="100"valign="top"align="center"><strong><bean:message key="market.task.remark"/></strong></td>
</tr>
</table>
<TABLE width="760" valign="top" height="12" border="1"
name="dynamicTable" id="dynamicTable">

<tr>
<td width="50"align="center">1:<html:checkbox property="idArr"/></td>
<td width="140"align="center"><html:text property="contents" value=""/></td>
<td width=""align="center"><html:text property="targets" value="" size="15"/></td>
<td width=""align="center"><html:text property="prompts" readonly="true" size="8" value="" οnclick="getDateString(this,oCalendarChs)"/>

</td>
<td width=""valign="center">
<html:select property="taskLevels">
<option value="1"><bean:message key="market.task.taskLevel1"/></option>
<option value="2"><bean:message key="market.task.taskLevel2"/></option>
<option value="3"><bean:message key="market.task.taskLevel3"/></option>
<option value="4"><bean:message key="market.task.taskLevel4"/></option>
</html:select>
</td>
<td nowrap="true" width=""align="center"><input type="text" name="assortUsersN1" value="" readonly="true" οnclick="return initSearch('assortUsersN1','assortUsers1')"/>
<input type="hidden" name="assortUsers1" value=""/>
<%-- <a href="#" οnclick="return initSearch('assortUsersN1','assortUsers1')">
<bean:message key="enginechange.selectPeople"/></a>--%>

</td>
<td align="center"><html:text property="remarks" size="15" value="" />
<html:hidden property="userIds" value=""/>
<html:hidden property="schedules" value="0"/>
<html:hidden property="evolves" value=""/>
<html:hidden property="difficultys" value=""/>
<html:hidden property="scheduleNos" value="0"/>
<html:hidden property="addPlaces" value="0"/>
</td>
</tr>
</TABLE>
</td>
</tr>
<tr>
<td width="770" height="12" valign="top" align="center">
<c:if test="${tbMartTaskMonthly.noSummarize=='0'|| tbMartTaskMonthly.noSummarize==null }">
<input type="button" name="addRow" value="<bean:message key="row_add"/>" οnclick="addTableRow('dynamicTable')">
<input type="button" name="delRow" value="<bean:message key="row_del"/>" οnclick="removeElements('dynamicTable')">
<input type="button" name="saveRow" value="<bean:message key="market.task.save"/>"
οnclick="save()">
<input type="button" name="delRow" value="<bean:message key="market.task.sh"/>"
οnclick="tjTask()">
</c:if>
<input type="button" name="delRow" value="<bean:message key="market.task.cent"/>"
οnclick="back()">
</td>
</tr>
<!------------------------>
</td>
</table>

</html:form>

<jsp:include page="../../letter/mainEnd.jsp"></jsp:include>
</body>
</html>
<script type="text/javascript" language="javascript">

<c:if test="${tbMartTaskDetails!=null && !empty tbMartTaskDetails}" >
<c:forEach var="tbMartTaskDetail" items="${tbMartTaskDetails}" varStatus="status">
<c:choose>
<c:when test="${status.index==0}">
document.all.contents.value='<c:out value="${tbMartTaskDetail.content}"/>';
document.all.targets.value='<c:out value="${tbMartTaskDetail.target}"/>';
document.all.prompts.value='<fmt:formatDate value="${tbMartTaskDetail.prompt}" pattern="yyyy-MM-dd" />'
document.all.taskLevels.value='<c:out value="${tbMartTaskDetail.taskLevel}"/>';
document.all.assortUsers1.value='<c:out value="${tbMartTaskDetail.assortUser}"/>';
document.all.assortUsersN1.value='<c:out value="${assortUsersN0}"/>';
document.all.remarks.value='<c:out value="${tbMartTaskDetail.remark}"/>';
document.all.userIds.value='<c:out value="${tbMartTaskDetail.userId}"/>';
document.all.schedules.value='<c:out value="${tbMartTaskDetail.schedule}"/>';
document.all.evolves.value='<c:out value="${tbMartTaskDetail.evolve}"/>'
document.all.difficultys.value='<c:out value="${tbMartTaskDetail.difficulty}"/>';
document.all.scheduleNos.value='<c:out value="${tbMartTaskDetail.scheduleNo}"/>';
document.all.addPlaces.value='<c:out value="${tbMartTaskDetail.addPlace}"/>';
</c:when>
<c:otherwise>
<c:set var="n" value="${status.index}" scope="request" />

addRowWithContent(<c:out value="${status.index}"/>,'<c:out value="${tbMartTaskDetail.content}" />','<c:out value="${tbMartTaskDetail.target}" />',
'<fmt:formatDate value="${tbMartTaskDetail.prompt}"pattern="yyyy-MM-dd" />','<c:out value="${tbMartTaskDetail.taskLevel}" />' ,
'<c:out value="${tbMartTaskDetail.assortUser}" />','<c:out value="${tbMartTaskDetail.remark}" />',
'<c:out value="${tbMartTaskDetail.userId}" />','<c:out value="${tbMartTaskDetail.schedule}" />',
'<c:out value="${tbMartTaskDetail.difficulty}" />','<c:out value="${tbMartTaskDetail.scheduleNo}" />',
'<c:out value="${tbMartTaskDetail.addPlace}" />','<c:out value="${tbMartTaskDetail.evolve}"/>','<%=request.getAttribute("assortUsersN"+request.getAttribute("n"))%>');
</c:otherwise>
</c:choose>
</c:forEach>
</c:if>
</script>
ghost_fly
关注
专栏目录
Jquery实现表格动态增加一行，删除一行.html
05-15
Jquery实现表格动态增加一行，删除一行(最简洁的代码实现)
动态增加行列
俊人呀的博客
08-20 765
1211
如何使用JavaScript实现一个简单的动态表格，实现添加一行和删除一行表格（两种方法）
m0_64053511的博客
02-08 8707
1方法一： 使用table的insertRow()方法插入一行，使用table.removeChild(tr)删除一行，具体的代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ text-align: c.
layui表格动态新增行
weixin_50139963的博客
07-08 1万+
当点击添加一行时动态添加一行： 首先定义表格： <%-- 表格–%> 添加一行 然后就是 table初始化： table.render({ elem: ‘#tabAddSell’,//table元素 id: ‘tabAddSell’, page: false, data:[],//这里赋初始值 cols: [[ {title: ‘序号’, width: 120,type:‘numbers’,totalRowText: ‘合计’}, {field: ‘id’, title:.
table动态增加一行
08-29
table动态增加一行，点击增加可增加，点击删除可以进行删除
Layui给数据表格动态添加一行并跳转到添加行所在页的方法
10-18
在使用Layui进行数据展示时，经常需要动态地向数据表格添加新行。官方文档并没有提供直接实现该功能的API或示例代码，因此需要开发者自行实现。常见的方法是通过JavaScript或jQuery来操作DOM，向表格中添加新的`<tr>...
jQuery实现html表格动态添加新行的方法
10-24
动态地向表格添加新行意味着我们需要通过某种方式触发添加行的操作，并且这一操作应该能够在页面上立即反映出结果。 在jQuery中，可以通过绑定事件处理器到某些HTML元素上来实现这一行为。比如，可以在一个按钮或...
JQuery实现动态表格点击按钮表格增加一行
10-25
- `function add()` 函数被设计来向表格添加新行。当点击添加按钮时，此函数将被触发。 - `var tbl = document.all.ci;` 获取一个表格引用（假设通过某种方式，例如一个ID或者类选择器，已经被选中），记为`tbl`。 ...
JS实现向表格中动态添加行的方法
10-24
该函数首先获取表格对象，然后在其顶部插入一行，并为新行中的两个单元格分别赋予文本内容。通过点击按钮，用户可以实现向表格中动态添加新行的功能。 需要注意的是，上述代码片段是一个简单的示例，它只展示了一个...
js动态给表格添加一行、删除一行
rmkloveme
10-30 1万+
最近写代码遇到这个需求，特地总结了一下写了个demo，如下所示： 代码： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;new document&lt;/title&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=g
表格动态增加行(JS)
weixin_30426879的博客
07-17 2083
我最近一直在学Javascript,因为在项目用的比较多，虽然现在大家都在说Web标准，实际上还没有一个严格的定义，我理解的Web标准是把结构、表现、行为这三者结合表现出来就OK了。那用什么来表现呢？当然是CSS样式，行为用什么来控制呢？就是Javascript,可想而知学习Javascript的重要性了，当然除了Javascript，还有Vbscript,不过本人比较倾向Javascript ...
点击添加，jsp页面表格自动添加一行
风之子的专栏
05-22 8612
点击添加，jsp表格自动增加一行：其中eq(x)代表表格第x行，clone()代表复制 var tr = $('#table tr').eq(1).clone(); $('#table').append(tr);
JS + HTML 表格动态添加一行
qq_44490330的博客
08-11 8215
JS + HTML 表格动态添加一行 一、使用innerHTML对表格进行添加一行 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ margin: 50px; } a{
Vue+element 实现表格的增加行、删除行的功能
热门推荐
葫芦娃的博客
08-26 2万+
功能需求： 1、实现一个表格，可以增加行 ，可以修改每一行的数据； 2、获取选中的行的数据，获取选中行的索引； 3、根据获取的行的索引删除相应的一行的数据。 tableData的数据可以从后台获取。 效果： 代码实现： <template> <div class="tableDate"> <div class="b...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值