jQuery隔行换色和上移下移问题
当我上调或下调时他就不是隔行换色了我希望调整后依旧是隔行换色这怎么解决//隔行换色$("tbodytr:odd").addClass("tr_odd");$("tbody...
当我上调或下调时 他就不是隔行换色了 我希望调整后依旧是隔行换色 这怎么解决
//隔行换色
$("tbody tr:odd").addClass("tr_odd");
$("tbody tr:even").addClass("tr_even");
//上移
var $up = $(".up")
$up.click(function() {
var $tr = $(this).parents("tr");
if ($tr.index() != 0) {
$tr.prev().before($tr);
}
});
//下移
var $down = $(".down");
var len = $down.length;
$down.click(function() {
var $tr = $(this).parents("tr");
if ($tr.index() != len - 1) {
$tr.next().after($tr);
}
}); 展开
//隔行换色
$("tbody tr:odd").addClass("tr_odd");
$("tbody tr:even").addClass("tr_even");
//上移
var $up = $(".up")
$up.click(function() {
var $tr = $(this).parents("tr");
if ($tr.index() != 0) {
$tr.prev().before($tr);
}
});
//下移
var $down = $(".down");
var len = $down.length;
$down.click(function() {
var $tr = $(this).parents("tr");
if ($tr.index() != len - 1) {
$tr.next().after($tr);
}
}); 展开
展开全部
在css定义好，不管怎样上移还是下移始终都是隔行换色的。
<style>
*{ padding:0;margin:0; }
.list{ width:358px;margin:0 auto;border:1px solid #000; }
.listview{ height:35px;line-height:35px;width:100%;text-indent:20px;color:#fff;background-color:#999; }
.listview:nth-child(2n){ background-color:#ccc;color:#000; }
.listview button{ padding:0 10px; }
</style>
</head>
<body>
<div class="list">
<div class="listview">1
<button class="up">上</button>
<button class="down">下</button>
</div>
<div class="listview">2
<button class="up">上</button>
<button class="down">下</button>
</div>
<div class="listview">3
<button class="up">上</button>
<button class="down">下</button>
</div>
<div class="listview">4
<button class="up">上</button>
<button class="down">下</button>
</div>
<div class="listview">5
<button class="up">上</button>
<button class="down">下</button>
</div>
</div>
</body>
<script type="text/javascript">
$(function(){
$(".up").click(function(){
if( $(this).parent().prev().index()>=0 ){
$(this).parent().prev().before($(this).parent());
}
});
$(".down").click(function(){
if( $(this).parent().next().index()<$(".listview").length ){
$(this).parent().next().after($(this).parent());
}
});
});
</script>
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
