<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery动态添加删除编辑标签代码 - </title>
<link rel="stylesheet"type="text/css" href="css/index.css">
</head>
<body>
<div class="wrap">
<!--选项卡标题内容 -->
<divclass="wrap-top">
<divclass="tab-left"><<</div>
<divclass="tab-right">>></div>
<divclass="cont-tab">
<divclass="cont-scroll">
<li>
<span>HTML</span>
<ahref="javascript:void
(0)">X</a>
<divclass="line"></div>
</li>
<li>
<span>CSS</span>
<ahref="javascript:void
(0)">X</a>
<divclass="line"></div>
</li>
<li>
<span>jQuery</span>
<ahref="javascript:void
(0)">X</a>
<divclass="line"></div>
</li>
<li>
<span>javascript</span>
<ahref="javascript:void
(0)">X</a>
</li>
</div>
</div>
</div>
<!--选项卡对应内容 -->
<divclass="wrap-content"> HTML</div>
<divclass="wrap-content"> CSS</div>
<divclass="wrap-content"> jQuery</div>
<divclass="wrap-content"> javascript</div>
<divclass="Add">
<span></span>
<divclass="memu">
<li class="add-cont">添加内容</li>
<liclass="del-cont">删除全部</li>
</div>
</div>
<!--全屏添加内容遮罩 -->
<divclass="full">
<divclass="full-wrap">
<divclass="full-top"><img src="img/add.png">添加
内容<span>X</span></div>
<!--添加选项卡内容 -->
<divclass="full-content">
<divclass="full-inp">
<span>添加标题:
</span>
<inputtype=""
name="" placeholder="选项卡标题">
</div>
<divclass="full-inp">
<span>添加内容:
</span>
<textarea
placeholder="选项相应内容"></textarea>
</div>
<divclass="full-inp">
<botton>确认
</botton>
</div>
</div>
</div>
</div>
<!--全屏修改内容遮罩 -->
<divclass="full-modify">
<divclass="full-wrap">
<divclass="full-top"><img src="img/modify.png">修
改内容<span>X</span></div>
<!--添加选项卡内容 -->
<divclass="full-content">
<divclass="full-modi">
<span>修改标题:
</span>
<inputtype=""
name=""placeholder="">
</div>
<divclass="full-modi">
<span>修改内容:
</span>
<textarea
placeholder=""></textarea>
</div>
<divclass="full-modi">
<botton>确认
</botton>
</div>
</div>
</div>
</div>
</div>
<scriptsrc="js/jquery.min.js"></script>
<!--使用低版本jQuery可以不调用jquery-migrate-1.2.1.min.js-->
<scriptsrc="js/jquery-migrate-1.2.1.min.js"></script>
<scriptsrc="js/tab.js"></script>
<scripttype="text/javascript">
$(".wrap").tabs()
</script>
<div style="text-align:center;margin:50px0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。
</p>
<p>来源:<a href="http://www.shaxiangift.com/"target="_blank"> </a></p>
</div>
</body>
</html>
联系客服