jQuery操作表格元素,整体添加与删除
来源:互联网 发布:mac如何强制重启 编辑:程序博客网 时间:2024/06/07 01:30
<s:form id="workForm" name="workForm" method="post" action="../work.action?method=update" theme="simple"><!-- 隐藏域 --><input type="hidden" name="userId" id="userId" value="${loginUser.userId }" /> <table id="workTable" width="98%" border="0" align="center" cellpadding="0" cellspacing="0" class="table"> <s:if test="#request.works!=null&&#request.works.size>0"> <s:iterator value="#request.works" id="work"> <tr id="trfirst"> <td > <table width="100%"> <tr> <td width="138">工作时间</td> <td colspan="3"> <input type="text" name="beginTime" value="${work.beginTime }" class="Wdate" onclick="WdatePicker()"/> ~ <input type="text" name="endTime" value="${work.endTime }" class="Wdate" onclick="WdatePicker()"/> <input type='button' onclick='deleteLine(this)'value='删除' class="job_application" style="float:right"/> </td> </tr> <tr> <td width="138">公司名称</td> <td> <input type="text" name="company" style="width:330px;" value="${work.company }" /> </td> </tr> <tr> <td width="138">岗位</td> <td><input type="text" name="station" style="width:330px;" value="${work.station }" /></td> </tr> <tr> <td width="138">工作描述</td> <td><input type="text" name="workDetails" style="width:330px;" value="${work.workDetails }" /></td> </tr> </table> </td> </tr> </s:iterator> </s:if> <s:else> <tr id="trfirst"> <td > <table width="100%"> <tr> <td width="138">工作时间</td> <td colspan="3"> <input type="text" name="beginTime" class="Wdate" onclick="WdatePicker()"/> ~ <input type="text" name="endTime" class="Wdate" onclick="WdatePicker()"/> <input type='button' onclick='deleteLine(this)'value='删除' class="job_application" style="float:right"/> </td> </tr> <tr> <td width="138">公司名称</td> <td> <input type="text" name="company" style="width:330px;"/> </td> </tr> <tr> <td width="138">岗位</td> <td><input type="text" name="station" style="width:330px;"/></td> </tr> <tr> <td width="138">工作描述</td> <td><input type="text" name="workDetails" style="width:330px;"/></td> </tr> </table> </td> </tr> </s:else> </table> <div class="clear"></div> <div align="center" style="margin-top:10px; margin-left:220px;"> <a href="javascript:void(0)" onclick="doSubmit()"><span class="job_application" >保存简历</span></a> <a href="javascript:void(0);" onclick="addLine()"><span class="job_application" >添加更多工作经历</span></a> </div> </s:form>
function addLine(){var newLine=$("#trfirst").clone();$(newLine.find("input:text")).val("");$("#workTable").append(newLine);$("#workTable>tbody>tr").removeClass("even_green");$("#workTable>tbody>tr:even").addClass("even_green");}function deleteLine(thisLine){//如果工作经历数量大于1if($("#trfirst table").size()>1){$(thisLine).parent().parent().parent().parent().parent().remove();$("#workTable>tbody>tr").removeClass("even_green");$("#workTable>tbody>tr:even").addClass("even_green");}else{$("#trfirst table input:text").val("");alert("已经全部删除");}}$("#workTable>tbody>tr:even").addClass("even_green") ;