jq操作table追加td
示例
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.0.0/jquery.min.js"></script>
</head>
<style type="text/css">
.well {
font-weight: 600;
position: relative;
height: 22px;
}
.add {
margin-left: 15px;
position: absolute;
cursor: pointer;
}
</style>
<body>
<table style="width:100%;border: 1px solid #ccc;" border="1" cellspacing="0" cellpadding="6" id="table1">
<tr>
<td align="center">1day</td>
<td align="center" class="well">景点 <span class="add">+</span></td>
<td align="center" rowspan="5">小计</td>
</tr>
</table>
</body>
<script>
$(document).ready(function() {
$(".add").click(function() {
$(this).parents('tr').after('<tr><td class="well"></td></tr>'); //1，追加tr
var num = $(this).parent().prev().attr('rowspan') ? $(this).parent().prev().attr('rowspan') : //2，判断第一个td有没有rowspan的属性
$(this).parent().prev().attr('rowspan', num + 1); //左侧的
$(this).parent().next().attr('rowspan', num + 1); //右侧的
})
})
</script>
</html>
jq操作table追加td的更多相关文章
- jQuery操作Table tr td常用的方法
虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...
- 汇总常用的jQuery操作Table tr td方法
虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...
- jq 操作table
转载于:http://www.jb51.net/article/34633.htm jquery获取table中的某行全部td的内容方法,需要的朋友可以参考一下 <table>< ...
- 关于jq操作table下多个type=radio的input的选中
假如有2个table: <table id="table1" border="0"> <tr> <td><input ...
- jQuery操作table tr td
1.鼠标移动行变色 $("#tab tr").hover(function(){ $(this).children("td").addClass("h ...
- JQ 获取Table的td 值
<script type="text/javascript"> function SetTable() { $("#myTab table").ea ...
- jq 获取table元素，ajax 静态填加数据
知识点: 1.jq如何操作table->操作html内的元素 2. this 怎么使用 问题: 1.点击 修改 后,自动刷新了.判断取值,提示错误.正确出不来 2.ajax传值操作如何保密 ht ...
- 关于checkbox操作 table
引入 Validform验证 <script type="text/javascript"> //添加操作 crrTrTdCkId=1; ...
- js实现动态操作table
本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...
随机推荐
- （15）Spring Boot使用Druid和监控配置【从零开始学Spring Boot】
Spring Boot 系列博客] 更多查看博客:http://412887952-qq-com.iteye.com/blog Spring Boot默认的数据源是:org.apache.tomcat ...
- 洛谷 P1129 BZOJ 1059 cogs 660 [ZJOI2007]矩阵游戏
题目描述 小Q是一个非常聪明的孩子,除了国际象棋,他还很喜欢玩一个电脑益智游戏――矩阵游戏.矩阵游戏在一个N*N黑白方阵进行(如同国际象棋一般,只是颜色是随意的).每次可以对该矩阵进行两种操作: 行交 ...
- hdu 4857 逆向拓扑排序+反向输出
/*一组测试实例 4 4 2 3 1 2 4 */ #include<stdio.h> #include<string.h> #include<queue> usi ...
- nginx 、tomcat 集群配置、shiro Session 共享
一.nginx.config 配置 #user nobody; worker_processes ; #error_log logs/error.log; #error_log logs/error. ...
- AIX中查看进程内存使用
AIX中查看进程内存使用 学习了:http://www.2cto.com/os/201308/235858.html 1,从大到小排列10个内存使用率进程 ps aux | head -1 ; p ...
- rsync与cwRsync
以下这个链接是windows之间的csRsync和csRsyncServer同步教程: http://www.cnblogs.com/wwufengg/p/rsync-config.html !Att ...
- 创建quickstart报错
在cmd中创建helloword成功(一开始是mvn package失败,后面又执行了一遍又成功了,应该是网络问题) 然后在eclipse 中创建quickstart,结果pom报错找不到如下包 ma ...
- Oracle 与 MySql 区别
一.并发性 并发性是oltp数据库最重要的特性,但并发涉及到资源的获取.共享与锁定. mysql:mysql以表级锁为主,对资源锁定的粒度很大,如果一个session对一个表加锁时间过长,会让其他se ...
- js面试题--js的继承
js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明白的继承机制.而是通过模仿实现的.依据js语言的本身的特性,js实现继承有下面通用的几种方式 1.使用对象冒充实现继承(该种实 ...
- Linux - 配置php-fpm 以及 配置nginx支持php
配置php-fpm [root@localhost php7]# which php-fpm /usr/local/php7/sbin/php-fpm [root@localhost php7]# p ...