jquery中prependTo()方法怎么让它只执行一次
<html><head><title>无标题文档</title><styletype="text/css"media="screen">a{margin:10px;}.b...
<html>
<head>
<title>无标题文档</title>
<style type="text/css" media="screen">
a{margin: 10px;}
.btn{
padding:20px;
background:#0FF;
color:#FFF;
}
.bg-deb{
background:#999;
color:#000;
}
.red{
background: red;
}
.col-1{
width:100%;
float:left;
}
</style>
</head>
<body>
<div id="line">
<a id="line1" href="javascript:void(0)" class="btn bg-deb">line1</a>
<a id="line2" href="javascript:void(0)" class="btn">line2</a>
</div><br />
<br />
<div id="line-test">
<div class="col-1" id="test1">
<div id="line-id-1">111111</div>
<div id="line-id-2">222222</div>
<div id="line-id-3">333333</div>
<div id="line-id-4">444444</div>
<div id="line-id-5">555555</div>
<div id="line-id-6">666666</div>
<div id="line-id-7">777777</div>
<div id="line-id-8">888888</div>
</div>
<div id="test2"></div>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("#line1").click(function(){
$(".col-1").css('width','100%');
$("#test2").removeClass("col-1");
$("#test2").children().appendTo($("#test1"));
$(this).addClass("bg-deb");
$("#line2").removeClass("bg-deb");
})
$("#line2").click(function(){
$("#line-test").children().addClass("col-1");
$(".col-1").css('width','50%');
$("#test1 div:odd").prependTo($("#test2"));
$(this).addClass("bg-deb");
$("#line1").removeClass("bg-deb");
})
</script>
</body>
</html>
我点击line2按钮的时候可以点击好几次,点击一次就把line1中的数据转移一次,我想只能转移一次而不是无限转换。 展开
<head>
<title>无标题文档</title>
<style type="text/css" media="screen">
a{margin: 10px;}
.btn{
padding:20px;
background:#0FF;
color:#FFF;
}
.bg-deb{
background:#999;
color:#000;
}
.red{
background: red;
}
.col-1{
width:100%;
float:left;
}
</style>
</head>
<body>
<div id="line">
<a id="line1" href="javascript:void(0)" class="btn bg-deb">line1</a>
<a id="line2" href="javascript:void(0)" class="btn">line2</a>
</div><br />
<br />
<div id="line-test">
<div class="col-1" id="test1">
<div id="line-id-1">111111</div>
<div id="line-id-2">222222</div>
<div id="line-id-3">333333</div>
<div id="line-id-4">444444</div>
<div id="line-id-5">555555</div>
<div id="line-id-6">666666</div>
<div id="line-id-7">777777</div>
<div id="line-id-8">888888</div>
</div>
<div id="test2"></div>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("#line1").click(function(){
$(".col-1").css('width','100%');
$("#test2").removeClass("col-1");
$("#test2").children().appendTo($("#test1"));
$(this).addClass("bg-deb");
$("#line2").removeClass("bg-deb");
})
$("#line2").click(function(){
$("#line-test").children().addClass("col-1");
$(".col-1").css('width','50%');
$("#test1 div:odd").prependTo($("#test2"));
$(this).addClass("bg-deb");
$("#line1").removeClass("bg-deb");
})
</script>
</body>
</html>
我点击line2按钮的时候可以点击好几次,点击一次就把line1中的数据转移一次,我想只能转移一次而不是无限转换。 展开
2个回答
2016-01-27 · 百度知道合伙人官方认证企业
育知同创教育
1【专注:Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址:北京市昌平区三旗百汇物美大卖场2层,微信公众号:yuzhitc】
向TA提问
关注
展开全部
控制prependTo()方法只执行一次的方法是调用前增加一个flag,设为false,调用后设置为true。后续检测flag,如果是true就return。
比如:
var flag = false;
$("#line2").click(function(){
if($(this).hasClass("bg-deb")){
return false;
}
$("#line-test").children().addClass("col-1");
$(".col-1").css('width','50%');
if(!flag){
$("#test1 div:odd").prependTo($("#test2"));
}
flag = true;
$(this).addClass("bg-deb");
$("#line1").removeClass("bg-deb");
})
jquery中,prependTo. 将元素添加到别的元素中作为头部子节点 ... 只执行一次的事件响应函数。
比如:
var flag = false;
$("#line2").click(function(){
if($(this).hasClass("bg-deb")){
return false;
}
$("#line-test").children().addClass("col-1");
$(".col-1").css('width','50%');
if(!flag){
$("#test1 div:odd").prependTo($("#test2"));
}
flag = true;
$(this).addClass("bg-deb");
$("#line1").removeClass("bg-deb");
})
jquery中,prependTo. 将元素添加到别的元素中作为头部子节点 ... 只执行一次的事件响应函数。
展开全部
$("#line2").click(function(){
if($(this).hasClass("bg-deb")){
return false;
}
$("#line-test").children().addClass("col-1");
$(".col-1").css('width','50%');
$("#test1 div:odd").prependTo($("#test2"));
$(this).addClass("bg-deb");
$("#line1").removeClass("bg-deb");
})
你初学者吧?代码写得有点繁琐,虽然能实现你的效果,但是可以考虑优化的。
追问
嗯 我连初学者都算不上 自己瞎研究的。。。解决了 谢谢了
追答
line1按钮也会有你说的这种情况,适当改下吧。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询