表格添加一行并在每行第一列大写字母显示jquery实现方法

<!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>add_tr</title>

<script src='jquery.js'></script>
<script>
//create letter
var letterArr = [];
for(var i=65,j=0;i<91;i++,j++)
{
letterArr[j] = String.fromCharCode(i);
}
$(function(){
$('#btnok').on('click',function(){
$('table').append('<tr>' + $('table tr:last').html() + '</tr>');
orderLine();
});
orderLine();
});
function orderLine(){
$('input.add').each(function(i){
console.log($(this));
$(this).val(letterArr[i]);
});
}
</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"></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表格添加一行并在每行第一列大写字母显示实现方法的更多相关文章

  1. 解决CsvWriter：中文乱码、末尾行多一行空格(/r)、非第一列空字符串""显示null问题

    一:主要内容 解决CsvWriter存csv,csv文件打开后中文乱码问题 解决CsvWriter存csv,csv文件最后一行总是多一行空行的问题 解决CsvWriter存csv,csv文件不是第一列 ...

  2. 利用jquery动态添加和删除表格的一行，并且保存单行数据

    开发时遇到一个需求:要求要在页面的表格可以添加和删除一行,并能填写对应的数据后保存这一行数据. HTML代码 界面使用了freemarker框架,teams是后台传过来的list类型数据 <fo ...

  3. 使用js为表格添加一行

    今天同事问了我一个问题,为表格添加新的行,我用的js写了一下,代码如下: <!DOCTYPE html> <html> <head> <meta charse ...

  4. 在网页中动态地给表格添加一行内容--HTML+CSS+JavaScript

    需求描述: 用户在页面上点击按钮,可以把文本框中的数据在表格的新的一行中显示,具体表现如下图: 如果如果输入框内容有一项为空,弹出对话框‘请将数据填入完全 步骤: 1.按钮注册单击事件 2.获取并判断 ...

  5. jQuery——表格添加数据

    1.遮罩层宽高100%,position,不占位 2.注册a标签的删除事件,用on()方法,以方法可以动态添加,之前js需要利用冒泡属性(父标签注册事件,子标签冒泡,target===li触发事件) ...

  6. 利用jQuery动态添加input输入框，并且获取他的值

    动态添加 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEnco ...

  7. 利用jquery给指定的table动态添加一行、删除一行

    转自:http://www.cnblogs.com/linjiqin/p/3148181.html $("#mytable tr").find("td:nth-child ...

  8. 利用jquery给指定的table动态添加一行、删除一行，复制，值不重复等操作

    $("#mytable tr").find("td:nth-child(1)") 1表示获取每行的第一列$("#mytable tr").f ...

  9. javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行

    jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...

随机推荐

  1. 【转】linux下tty，控制台，虚拟终端，串口，console（控制台终端）详解----不错

    原文网址:http://blog.csdn.net/liaoxinmeng/article/details/5004743 首先: 1.终端和控制台都不是个人电脑的概念,而是多人共用的小型中型大型计算 ...

  2. hdu 5422 Rikka with Graph（简单题）

    Problem Description As we know, Rikka is poor at math. Yuta is worrying about this situation, so he ...

  3. BootStrap学习之先导篇——响应式网页

    Bootstrap学习之前,要知道响应式网页的原理. 1.什么是响应式网页? 一个页面,可以根据浏览设备的不同,以及特性的不同,而自动改变布局.大小等.使得在不同的设备上上都可以呈现优秀的界面. 优点 ...

  4. 【转】Devexpress使用之：GridControl控件（合并表头）

    Devexpress系列控件功能很强大,使用起来也不太容易,我也是边摸索边使用,如果有时间我会把常用控件的使用方法整理出来的. using System; using System.Collectio ...

  5. [TypeScript] Avoid any type

    To avoid using "any" type is a best pratice. The reason for that is it disable the power o ...

  6. oracle数据库常用查询一

    oracle数据库常用查询一 sqlplus / as sysdba; 或sqlplus sys/密码 as sysdba;两者都是以sys登录.conn scott/tiger@orcl; conn ...

  7. jquery之onblur事件

    onblur事件与html结合 function discountCheck(){ //var checkVal=$('input:text[name="Fee1"]').val( ...

  8. Key lock 的秘密

    研究死锁,或者观察sp_lock,有时候最恼人的莫过于你看到下面研究成果的key lock,但是却不知道究竟是哪个page 哪个row被lock住了: Exec sp_lock:   就说上面的key ...

  9. js中完数的输出

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  10. hdu5338 ZZX and Permutations(贪心、线段树)

    转载请注明出处: http://www.cnblogs.com/fraud/          ——by fraud ZZX and Permutations Time Limit: 6000/300 ...