jquery添加的问题.
求高手啊.想实现点击BUTTON按钮然后出现一个ul点击ul在ul后面跟一个li比如button点两下出俩ul点第一个ul的时候第一个ul后面出现一个li可以点多次出多次...
求高手啊. 想实现点击BUTTON按钮 然后出现一个ul 点击ul 在ul后面跟一个li 比如button点两下 出俩ul
点第一个ul的时候 第一个ul后面出现一个li 可以点多次出多次
点第二个ul的时候 第二个后面出li 点多次出多次这种. 我现在只能实现让最后一个ul追加li
比如点一下button 出一个ul 点击这个ul 可以出一个li 多点多出. 但是再点button 在出一个ul的时候 上面ul就不能追加li了 只能给下面的ul追加. 下面是代码.
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
var i = 0;
$(function(){
$("input").click(function(){
i++;
$("p[id='a']").append("<p><ul id="+i+">类型"+i+"</ul></p>");
});
$("p").click(function(){
alert(i);
$("ul[id="+i+"]").each(function(){
$("ul[id="+i+"]").append("<li>项目"+i+"</li>");
});
});
});
</script>
<style type="text/css">
li{
list-style-type: none;
float: left;
}
</style>
</head>
<body>
<p id="a"><input type="button" value="添加"/></p>
</body>
</html> 展开
点第一个ul的时候 第一个ul后面出现一个li 可以点多次出多次
点第二个ul的时候 第二个后面出li 点多次出多次这种. 我现在只能实现让最后一个ul追加li
比如点一下button 出一个ul 点击这个ul 可以出一个li 多点多出. 但是再点button 在出一个ul的时候 上面ul就不能追加li了 只能给下面的ul追加. 下面是代码.
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
var i = 0;
$(function(){
$("input").click(function(){
i++;
$("p[id='a']").append("<p><ul id="+i+">类型"+i+"</ul></p>");
});
$("p").click(function(){
alert(i);
$("ul[id="+i+"]").each(function(){
$("ul[id="+i+"]").append("<li>项目"+i+"</li>");
});
});
});
</script>
<style type="text/css">
li{
list-style-type: none;
float: left;
}
</style>
</head>
<body>
<p id="a"><input type="button" value="添加"/></p>
</body>
</html> 展开
2个回答
展开全部
把js那段改成这样就可以了：
<script type="text/javascript">
var i = 0;
$(function(){
$("input").click(function(){
i++;
$("p[id='a']").append("<ul id='"+i+"' onclick='Cmd(this)'>类型"+i+"</ul>");
});
});
function Cmd(v){
$(v).append("<li>项目"+i+"</li>");
}
</script>
需要注意的是，添加之后项目会在类型的前面，因为ul里的文字会显示在li的后面
追问
额. 谢谢你了. 不过有什么办法可以让项目添加到类型的后面吗. 用ulli不能实现?
追答
<script type="text/javascript">
var i = 0;
var j = 0;
$(function(){
$("input").click(function(){
i++;
$("p[id='a']").append("<table><tr style='height:50px;'><td onclick='Cmd(this)'>类型"+i+"</td><td><ul></ul></td></tr></table>");
});
});
function Cmd(v){
j++;
$(v).parent("tr").find("ul").eq(0).append("<li>项目"+j+"</li>");
}
</script>
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
