表单处理之添加删除表单行

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title></title>

</head>

<body>

<div id="search_conditions">

<div class="condition">

<a onclick="AddCondition(this,‘#search_conditions‘)">+</a>

<input />

</div>

</div>

<script src="js/jquery-1.8.2.min.js"></script>

<script>

function AddCondition(ths,container){

//ths 这里指<a></a>标签

var cp = $(ths).parent().clone();

//克隆标签<a></a>父标签并赋给变量cp

cp.children(‘:first‘).text(‘-‘).attr(‘onclick‘,"RemoveCondition(this,‘#search_conditions‘)");

//获取父标签第一个孩子a标签中的内容然后通过text将内容修改为‘-‘,

//接着通过attr修改onclick绑定的函数AddCondition为RemoveCondition

$(‘#search_conditions‘).append(cp);

//将克隆后的结果cp追加到父标签中

//cp.appendTo(‘#search_conditions‘)

}

function RemoveCondition(ths,container){

//ths形参代表标签<a></a>,所以标签a的父标签为<div class="condition"></div>,

//然后删除整个父标签从而实现删除整个表单的功能

$(ths).parent().remove();

}

</script>

</body>

</html>

演示效果:

时间: 2025-01-20 04:27:07

表单处理之添加删除表单行的相关文章

thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息

form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架:target,规定在何处打开链接文档. 另外想要实现一个好看的方便.能重复使用的弹窗就要开发一个弹窗插件了,这里推荐使用前端的弹窗插件sweetalert.js,为了方便.重复使用我们把它成封装一个函数,页面要引入sweetalert.js的css和js文件 后端:为了方便以后重复使用,先写一个公共

深入理解表单脚本系列第二篇——表单字段

× 目录 [1]访问 [2]属性 [3]方法[4]事件 前面的话 表单字段又叫表单元素,表示表单所包含控件,如<input>.<select>等.本文将详细介绍表单字段的内容 访问 每个表单都有elements属性,该属性是表单中所有元素的集合.这个elements集合是一个有序列表,其中包含着表单中的所有字段,如<input>.<textarea>.<button>和<fieldset> 每个表单字段在elements集合中的顺序,

2017.2.28 activiti实战--第六章--任务表单(一)动态表单(待)

学习资料:<Activiti实战> 第六章 任务表单(一)动态表单 内容概览:本章要完成一个OA(协同办公系统)的请假流程的设计,从实用的角度,讲解如何将activiti与业务紧密相连. 第四章中讲解了两种表单:动态表单和外置表单的区别.这里将使用不同的表单来完成相同的功能. 1 动态表单:<activiti:formProperty> 2 外置表单:<activiti:formKey>

深入理解表单脚本系列第一篇——表单对象

× 目录 [1]表单属性 [2]表单事件 [3]表单方法 前面的话 javascript最初的一个应用就是分担服务器处理表单的责任,打破处处依赖服务器的局面.尽管目前的web和javascript已经有了长足的发展,但web表单的变化并不明显.由于web表单没有为许多常见任务提供现成的解决方法,很多开发人员不仅会在验证表单时使用javascript,而且还增强了一些标准表单控件的默认行为.本文是表单脚本系列第一篇——表单对象 表单属性 在HTML中,表单是由form元素来表示的,而在javasc

创建表,创建数据库, 删除表 ,删除数据库

创建表,创建数据库, 删除表 ,删除数据库 创建数据库 Create  database  text2  创建数据库text2 2. 删除数据库 Drop  database   text2  删除数据库text2 创建表 Create  table class   创建一个表叫class                  这是个主表 ( Code  varchar(20)  primary key,                                     创建序号 Name  

[Swift通天遁地]二、表格表单-(10)快速添加日期选择/多选/动作表单/地图等自定义表单

本文将演示创建一个更加强大的表单. Github项目:[Eureka] 下载该项目的源代码. 选择该项目中的几个文件,拖动到自己的开发项目中.按住[Shift],选择 文件夹[Example]->选择 一个自定义的单元格的类文件[CustomCells.swift] 文件夹[Helpers] 文件夹[CustomRows] ->保持默认的设置选项,点击[Finish] 选择资源文件夹[Assets.xcassets],导入项目中需要使用的图片. 在项目导航区,打开视图控制器的代码文件[View

mysql 修改 添加 删除 表字段

添加表的字段    alter table 表名  add  字段名  字段的类型 例子:        alter table table1 add transactor varchar(10) not Null; alter table   table1 add id int unsigned not Null auto_increment primary key 在mysql数据库中怎样在指定的一个字段后面添加一个字段: alter table newexample add address

jQuery获取Select选择的Text(非表单元素)和 Value(表单元素)(转)

jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text 3. var checkValue=$("#selec

表单,框架,样式表的分类及选择器基础

表单元素1.<from>代表表单,其中属性有action提交给你所设定的页面,method数据提交的方式(get显示提交有长度限制,post隐式提交). 2.文本的表示类型:1.文本框<input>其属性有type类型选择其中的text,valune是文本框的值,name是文本框的名称.2.<input>密码框,其中属性tybe选择password.3.隐藏域其tybe选择hidden.4!文本域用双标签<textarea>,他的值是写在开始和结束标签之间的