<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>用户名注册</title>
  <script>
    $(document).ready(function () {
      $("#button").click(function () {
        var name = $("#yonghu").val();
        var mima = $("#mima").val();
        var youxiang = $("#youxiang").val();
        var tr = "<tr><td>" + '<input type="checkbox">' + "</td><td>" + name + "</td><td>" + mima + "</td><td>" + youxiang + "</td><td>" + '<input type="button" value="删除">' + "</td></tr>";
        $("#table").append(tr);
        $(":button").click(function () {
          $(this).parent().parent().remove();
        });
      });
    });
  </script>
</head>
<body>
用户:<input id="yonghu" type="text">
密码:<input id="mima" type="password">
邮箱:<input id="youxiang" type="text">
<input type="submit" id="button" value="添加">
<table id="table" border="1ps">
  <tr>
    <td><input type="checkbox"></td>
    <td>用户名</td>
    <td>密码</td>
    <td>邮箱</td>
    <td>操作</td>
  </tr>
</table>
</body>
</html>

运行结果：

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery form操作技巧汇总》、《jQuery操作json数据技巧汇总》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》、《jQuery表格(table)操作技巧汇总》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

jQuery实现表单动态添加与删除数据操作示例的更多相关文章

  1. Jquery实现表单动态加减、ajax表单提交

    一直在搞Java后台开发,记得刚工作那一两年时间搞过前后端交互开发,用的东西也是五花八门,当时觉得做页面展示给别人看,是很有成就的事情,不过现在感觉自己跟纯前端开发比起来弱爆了,不过如果你的目标是作为 ...

  2. js表单动态添加数据并提交

    情景1:已经存在form对象了,动态为form增加对象并提交 function formAppendSubmit(){ var myform=$('#newArticleForm'); //得到for ...

  3. jquery 为表单动态添加元素

    $('<input />').attr('type','hidden')            .attr('name','type')            .attr('value', ...

  4. jquery 动态添加和删除 ul li列表

    今天需要实现一个jquery动态添加和删除  ul li列表中的li行,自己简单的实现乐一个,分享一下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

  5. Angular-表单动态添加删除

    angular本身不允许去操作DOM,在angular的角度来说,所有操作都以数据为核心,剩下的事情由angular来完成.所以说,想清楚问题的根源,解决起来也不是那么困难. 前提 那么,要做的这个添 ...

  6. 用 jQuery 实现表单验证（摘抄）

    ——选自<锋利的jQuery>(第2版)第5章的例题  5.1.5 表单验证 表单作为 HTML 最重要的一个组成部分,几乎在每个网页上都有体现,例如用户提交信息.用户反馈信息和用户查询信 ...

  7. bootstrap+jQuery.validate表单校验

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  8. jQuery.validate表单校验+bootstrap

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  9. 用 jQuery 实现表单验证（转载）

    jQuery 官方 API 地址: http://api.jquery.com/ 在线引用 jQuery:http://code.jquery.com/ ——选自<锋利的jQuery>(第 ...

随机推荐

  1. GitHub从小白到熟悉<六>

    复制或 克隆 项目 

  2. Python-RabbitMQ-fanout（广播模式）

    生产者:fanout_publiser.py import pika import sys connection = pika.BlockingConnection(pika.ConnectionPa ...

  3. 基本MVC2模式创建新闻网站

    一.介绍 这实现比较简单,就是对两张表的操作,登录利用session验证用户信息. 2.效果

  4. java中的异常和处理详细理解

    异常是程序中的一些错误,但并不是所有的错误都是异常,并且错误有时候是可以避免的. 比如说,你的代码少了一个分号,那么运行出来结果是提示是错误 java.lang.Error:如果你用System.ou ...

  5. 多线程编程-- part5.1 互斥锁之非公平锁-获取与释放

    非公平锁之获取锁 非公平锁和公平锁在获取锁的方法上,流程是一样的:它们的区别主要表现在“尝试获取锁的机制不同”.简单点说,“公平锁”在每次尝试获取锁时,都是采用公平策略(根据等待队列依次排序等待):而 ...

  6. centos 7 私有云盘 OwnCloud 安装搭建脚本

    #!/bin/bash #Build LAMP Server Conf mysql_secure_installation service mariadb restart systemctl enab ...

  7. 模块之-random(随机模块)

    模块之-random(随机模块) random #shuffle 洗牌功能 >>> i=[1,2,3,4,5,6] >>> random.shuffle(i) &g ...

  8. windows删除已注册服务

    背景:近日,想要学习mysql主从复制,于是想在本地用多个mysql实例进行试验,试验的过程中总是挫折不断,生手不易,安装了很多实例,测试完成之后,想要删除这些实例. 虽然任务管理器可以停止任务,但是 ...

  9. 转(static final 和final的区别)

    学习java的时候常常会被修饰符搞糊涂,这里总结下static final和final的区别. 1.static 强调只有一份,final 说明是一个常量,final定义的基本类型的值是不可改变的,但 ...

  10. R 语言中的简单线性回归

    ... sessionInfo() # 查询版本及系统和库等信息 getwd() path <- "E:/RSpace/R_in_Action" setwd(path) rm ...