html代码例如以下

<html>

    <tr><button style="margin-left:10px" class="add_field_button btn">Add</button></tr>

    <tbody class="input_fields_wrap"></tbody>

</html>

js代码例如以下

<script>

   var max_fields      = 5; //maximum input boxes allowed

    var wrapper          = $(".input_fields_wrap"); //Fields wrapper

    var add_button    =(".add_field_button"); //Add button ID

    var x = 1; //initlal text box count

    $(add_button).click(function(e){ //on add input button click

        e.preventDefault();

        if(x < max_fields){ //max input box allowed

            x++; //text box increment

            $(wrapper).append('<tr style=""><td></td><td><button  class="remove_field btn">Del</button></td></tr>'); //add input box

            }

    }); 

    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text

        e.preventDefault(); $(this).closest('tr').remove(); x--;

    })

</script>

jquery 动态添加，降低input表单的方法的更多相关文章

  1. jquery实现ajax提交form表单的方法总结

    本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一:  function AddHandlingFeeToRefund( ...

  2. 如何给动态添加的form表单控件添加表单验证

    最近使用jQuery Validate做表单验证很方便,api地址为http://www.runoob.com/jquery/jquery-plugin-validate.html 但是在使用的时候也 ...

  3. jquery实现ajax提交form表单的方法总结（转）

    方法一: 复制代码 代码如下: function AddHandlingFeeToRefund() {            var AjaxURL= "../OrderManagement ...

  4. angular 1.2.29版本下 动态添加多个表单、 校验全部、 提交 、ng-form方案

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

  5. 为何jquery动态添加的input value无法提交到数据库？【坑】

    有两个输入框,我想让第一个输入框失去焦点以后,第二个输入框自动获取第一个输入框的value为默认值,jquery代码如下,可以正常显示,但是用PHP提交数据,并插入数据库的时候确实空值,尚未查找到原因 ...

  6. 解决chrome浏览器对于自动填充的input表单添加的默认的淡黄色背景问题 && 一般的浏览器input和button的高度不一致问题

    解决chrome浏览器对于自动填充的input表单添加的默认的淡黄色背景问题 如果我们把一个表单设置位 autofocus ,这时这个表单在获取焦点后就会产生淡黄色的背景,我们就是使用!importa ...

  7. jquery监听动态添加的input的change事件

    使用下面方法在监听普通的input的change事件正常 $('#pp').on('change', 'input.videos_poster_input', function () { consol ...

  8. 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能

    当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.ap ...

  9. 使用jQuery，实现完美的表单异步提交

    jQuery异步提交表单 <form id="form1" method="post"> <table border="1" ...

随机推荐

  1. this.treeData = JSON.parse(JSON.stringify(this.d)) 树的序列化反序列化

    this.treeData = JSON.parse(JSON.stringify(this.d))

  2. docker 镜像管理操作

    镜像特点 1. 分层存储的文件 2.一个软件运行环境 3.一个镜像可以创建多个容器 4.一种标准交付 5.不包含Linux内核而又精简的Linux操作系统 6.不是一个单一的文件而是由多层构成的,可以 ...

  3. Ubuntu16.04下安装pip

    按照下面的步骤来安装 sudo apt-get install python-setuptools python-dev build-essential 安装python2的pip   (要想好你用p ...

  4. mysql中使用load data infile导入数据的用法

    有时需要将大量数据批量写入数据库,直接使用程序语言和Sql写入往往很耗时间,其中有一种方案就是使用mysql load data infile导入文件的形式导入数据,这样可大大缩短数据导入时间. LO ...

  5. 【EL&JSTL】学习笔记

    一.EL表达式(形式:${ }) 1. 1 EL运算符 算术运算符: +.-.*./.% 示例 结果 ${1+1} 2 ${1-1} 0 ${1*3} 3 ${3/2} 1.5 ${5%3} 2 关系 ...

  6. git/github初级使用

    1.常见的github 国内最流行的php开发框架(thinkphp):https://github.com/top-think/thinkphp 全球最流行的php框架(laravel):https ...

  7. C语言学习12

    希尔排序 //希尔排序 #include <stdio.h> void main() { ], i; int shell(int a[], int n); printf("请输入 ...

  8. 电源模块PCB设计

    电源模块的PCB设计 电源电路是一个电子产品的重要组成部分,电源电路设计的好坏,直接牵连产品性能的好坏.我们电子产品的电源电路主要有线性电源和高频开关电源.从理论上讲,线性电源是用户需要多少电流,输入 ...

  9. redis异常信息：MISCONF Redis is configured to save RDB snapshots, but it is currently not able to persist on disk.。。。。

    redis.exceptions.ResponseError: MISCONF Redis is configured to save RDB snapshots, but it is current ...

  10. Java学习关于集合框架的基础接口--Collection接口

     集合框架(Collection  Framework)是Java最强大的子系统之一,位于java.util 包中.集合框架是一个复杂的接口与和类层次,提供了管理对象组的最新技术.Java集合框架标准 ...