jquery中table里面的tr里的input添加一行,并且第一列autoincrement
实现添加一行并且第一列由A0开始autoincrement,代码如下(在文件的同一个文件夹下添加一个jquery.js文件):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>autoincrement</title> <script src='jquery.js'></script>
<script>
$(function(){
$('#btnok').on('click',function(){
//get the last tr
var addObj = $('<tr>' + $('table tr:last').html() + '</tr>');
//get class="add" last value
var valObj = $('input.add').last().val(),prefix = valObj.substr(0,1), lotId = prefix + (parseInt(valObj.substr(1))+1);
console.log(addObj);
addObj.find('input.add').val(lotId);
$('#tta').append(addObj);
});
});
</script>
</head>
<body>
<input id="btnok" type='button' value="click">
<table border='1' width="400" id="tta"> <tr width="200">
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr> <tr width="200">
<td><input type="text" name="add[]" class="add" value="A0"></td>
<td><input type="text"></td>
<td><input type="text"></td>
<td><input type="text"></td>
<td><input type="text"></td>
</tr> </table>
</body>
</html>
jquery中table里面的tr里的input添加一行,并且第一列autoincrement的更多相关文章
- 纪录一个table元素里面的tr th td
<table border="1"> <tr> <th>name</th> <th>sex</th> < ...
- jquery获取table,遍历输出tr中各个td的内容(转载)
首先,依赖jquery.. 1 $('#btntb').click(function(){ 2 $('#tab tr').each(function(i){ // 遍历 tr 3 $(this).ch ...
- JQuery中Table标签页和无缝滚动
HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...
- jQuery操作Table tr td常用的方法
虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...
- 汇总常用的jQuery操作Table tr td方法
虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...
- jQuery操作table tr td
1.鼠标移动行变色 $("#tab tr").hover(function(){ $(this).children("td").addClass("h ...
- jQuery操作Table学习总结[转]
<style type="text/css"> .hover { } </style>< ...
- es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- Jquery操作Table
Jquery 操作 Html Table 是很方便的,这里对表格的基本操作进行一下简单的总结. 首先建立一个通用的表格css 和一个 表格Table: table { border-collapse: ...
随机推荐
- poj2723-Get Luffy Out
一道2-SAT问题,每对钥匙需要加一条边,每扇门上的对应的要用的钥匙加一条边. 其实求解2-SAT问题,关键在于找到不能同时成立的条件,例如在本题中,每对钥匙不能同时使用,每扇门上的钥匙不能同时不使用 ...
- C# - List操作 - 按照字母排序
有Family的类如下: public class FamilyModel { public string Name { set; get; } } 创建List List<FamilyMode ...
- js bom中浏览器兼容问题判断代码
var btn = document.getElementById('d1');if(addEventListener===undefined){ btn.attachEvent('onclick', ...
- js原型和原型链个人理解(我的理解)
<script> //普通对象与函数对象,js万物皆是对象 //自带的 function a1() { function f1() {} var f2=function () {} var ...
- 几道php基础面试题
前言 昨晚实验室一师弟在微薄上@我,给我发了几道php的基础面试题,这里把我写的答案贴出来 题目 (1)写一个函数获取URL的文件后缀,例如“http://www.feiyan.info/test.p ...
- Python一日一练05----怒刷点击量
功能 自己主动获取CSDN文章列表,并对每篇文章添加点击量. 源代码 import urllib.request import re import time import random from bs ...
- java开发之基础篇2
一.java开发环境的搭建 下载和安装jdk.版本自己看着办! 1 JAVA_HOME C:\Program Files\Java\jdk1.7.0_25 2 path C:\Program File ...
- HTML5 prefetch即预加载
原文地址 声明:此文带着自己的理解,不完全按原文翻译 prefetch 即预加载,在用户需要前我们就将所需的资源加载完毕. 有了浏览器缓存,为何还需要预加载? 用户可能是第一次访问网站,此时还无缓存 ...
- 试用Let's encrypt
终于等到 https://letsencrypt.org beta了,马上下载试用,发现过程超简单. 1.首先需要下载letsencrypt的客户端,官方给的介绍是 The Let’s Encrypt ...
- iOS图片设置圆角
一般我们在iOS开发的过程中设置圆角都是如下这样设置的. imageView.clipsToBounds = YES; [imageView.layer setCornerRadius:]; 这样设置 ...