JQuery添加删除标签
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="../js/jquery-3.2.1.min.js"></script>
<link rel="stylesheet" href="../css/JQ08_24_04.css">
<title>添加标签</title>
</head>
<body>
<div>
<a href="javascript: return false">标签<span>X</span></a>
</div>
<input type="button" value="添加标签">
<script src="../js/JQ08_24_04.js"></script>
</body>
</html>
css
______________________________________________________
*{margin: 0;padding: 0}
a{text-decoration: none}
div{
background: #e2e2e2;
height: 500px;
}
a{
position: relative;
display: block;
width: 80px;
height: 30px;
line-height: 30px;
color: white;
background: green;
text-align: center;
margin: 0 5px;
float: left;
}
span{
position: absolute;
color: red;
right: 5px;
}
js
_________________________________________________________
$(function () {
$("input").click(function () {
$("div").append("<a href='javascript: return false'>标签<span>X</span></a>");
});
//事件委托至document，利用on()给所有未渲染的标签绑定click事件，冒泡传递给document
$(document).on("click","span",function () {
var i = $(this).index();
$("a").eq(i).remove();
})
});
JQuery添加删除标签的更多相关文章
- jQuery添加删除元素
$(document).ready(function () { $('#radioExtranet').on('click', function () { showProjectInformation ...
- 分别使用原生js和jQuery添加/删除元素的class属性
一.原生js添加/删除元素的class属性: <!-- span元素原有class = "test" --> <span class="test&quo ...
- jQuery添加删除节点例子第十节"员工增删表"
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- jQuery 添加 删除 改动select option
jQuery获取Select选择的Text和Value: 1. var checkText=jQuery("#select_id").find("option:selec ...
- jQuery添加/删除元素
jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容(仍然该元素的内部). 追加前:<p>这是一个文本段落</p> $(" ...
- jQuery添加删除
//代码 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <titl ...
- jQuery添加/删除Select的Option项
使用语法1. $("#select_id").append("<option value='Value'>Text</option>") ...
- jquery 添加html标签
<script type="text/javascript"> var sss = 1; function addFile() { if (sss < 20) { ...
- jQuery 增加 删除 修改select option .
jQuery获取Select选择的Text和Value: 1. var checkText=jQuery("#select_id").find("option:selec ...
随机推荐
- hdu 1203 I NEED A OFFER!（01背包）
题意:"至少一份offer的最大概率".即求拿不到offer的最小概率 (得到offer的最大概率 = 1 - 反例的最小概率). 状态转移方程:dp[j]= Min(dp[j], ...
- python 使用微信远程控制电脑
今天来分享一个"高大上"的技术--使用python编写一个能够用微信远程控制电脑的程序! 先来分析一下控制的详细流程: 我们使用微信给特定的邮箱发送一封邮件,当中包括了我们想要电脑 ...
- 调试Scrapy过程中的心得体会
1.大量抓取网页时出现“Memory Error”解决办法:设置一个队列,每当爬虫空闲时才向队列中放入请求,例如: from scrapy import signals, Spider from sc ...
- openssl源码安装
下载最新的OpenSSL http://openssl.org/source/ ./config make make install 通过命令openssl version或者openssl ...
- A charge WIFI point base on airbase-ng+dhcp+lamp+wiwiz
Make wifi as a hot point Make a script echo $0 $1 case $1 in "start") sleep 1 ifconfig wla ...
- Jquery获取iframe中的元素
iframe与父页面之间相互获取元素的方法: 1.从父页面中获取iframe页面中的元素: 用法: $(window.frames["iframe_include_adverse" ...
- OpenStack 使用Ceph 配置指导
概述 Ceph 作为分布式文件系统,不但具有高可靠性.高扩展性.高性能. 也是统一存储系统.支持对象存储.块存储.文件存储,本文介绍怎样使用Ceph 块存储作为OpenStack的Glance.Nov ...
- 一个中断服务子程序ISR
请看下面的程序(一个中断服务子程序ISR),请指出这段代码的错误.)［中国台湾某著名CPU生产公司2005年面试题］ 答案:(1)ISR不能返回一个值.如果你不懂这个,那么是不会被雇用的.(2)ISR ...
- yum 安装 mysql5.5 mysql 5.6 mysql5.7
一. yum 安装mysql5.6 1. 安装仓库 要使用yum 安装mysql,需要使用mysql的yum 仓库,先从官网下载适合你的系统仓库 http://dev.mysql.com/down ...
- 计算机网络--DNS
1.域名系统DNS(domain name system)是因特网使用的命名系统,用来把便于人们时用的机器名字转换为IP地址.因特网的域名系统DNS被设计成一个联机分布式数据库系统,并采用客户服务器方 ...