代码写的不对如果我点击当前这个，显示，然后我不点击让他关闭接着点击下一个，就出现两个都显示了
0
[已解决问题]
解决于 2016-05-10 11:47
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
table.tab {
width: 1020px;
margin-top: 38px;
position: relative;
}
table.tab tr td {
border: 1px solid #b4b4b4;
padding: 12px;
text-align: center;
color: #333;
}
table.tab tr td > a:hover {
color: blue;
text-decoration: underline!important;
}
table.tab .row-1 {
background-color: #e3e3e3;
}
.dialog {
position: relative;
}
.test {
display: none;
width: 280px;
padding: 8px;
border: 2px solid #ddd;
position: absolute;
top: 28px;
left: 58px;
background-color: #f7fffb;
z-index: 99;
}
.test table {
width: 258px;
background-color: white;
}
.test table td {
padding: 2px!important;
}
</style>
</head>
<body>
<div class="tables">
<div class="recent">
<h5>交易记录 <span class="lv">查看更多交易</span></h5>
<table class="tab">
<tr class="row-1">
<td>创建时间</td>
<td>交易类型</td>
<td>金额|明显</td>
<td>状态</td>
</tr>
<tr>
<td>2016.4.14 16:25</td>
<td>充值</td>
<td class="lv dialog">+100.00 <i class="btns">点击</i>
<div class="test">
<table cellpadding="1" cellspacing="1" class="tb-more">
<tr>
<td>充值方式：线上充值</td>
<td>卡号：后四位8888</td>
</tr>
<tr>
<td colspan="2">付款时间：2016.4.11 16:50:50</td>
</tr>
</table>
</div>
</td>
<td>交易成功</td>
</tr>
<tr>
<td>2016.4.14 16:25</td>
<td>充值</td>
<td class="lv dialog">+100.00 <i class="btns">点击</i>
<div class="test">
<table cellpadding="1" cellspacing="1" class="tb-more">
<tr>
<td>充值方式：线上充值</td>
<td>卡号：后四位8888</td>
</tr>
<tr>
<td colspan="2">付款时间：2016.4.11 16:50:50</td>
</tr>
</table>
</div>
</td>
<td>交易成功</td>
</tr>
<tr>
<td>2016.4.14 16:25</td>
<td>充值</td>
<td class="lv dialog">+100.00 <i class="btns">点击</i>
<div class="test">
<table cellpadding="1" cellspacing="1" class="tb-more">
<tr>
<td>充值方式：线上充值</td>
<td>卡号：后四位8888</td>
</tr>
<tr>
<td colspan="2">付款时间：2016.4.11 16:50:50</td>
</tr>
</table>
</div>
</td>
<td>交易成功</td>
</tr>
<tr>
<td>2016.4.14 16:25</td>
<td>充值</td>
<td class="lv dialog">+100.00 <i class="btns">点击</i>
<div class="test">
<table cellpadding="1" cellspacing="1" class="tb-more">
<tr>
<td>充值方式：线上充值</td>
<td>卡号：后四位8888</td>
</tr>
<tr>
<td colspan="2">付款时间：2016.4.11 16:50:50</td>
</tr>
</table>
</div>
</td>
<td>交易成功</td>
</tr>
</table>
</div>
</div>
<script src="js/jquery-1.11.3.js"></script>
<script>
$().ready(function(){
$(".btns").each(function(index){
$(this).click(function(){
if($(this).next().is(":hidden")){
$(this).next().show();
}else{
$(this).next().hide();
}
});
})
});
console.log($(".btns").next());
</script>
</body>
</html>
最佳答案
0
$().ready(function(){ $(".btns").click(function(){ $(".btns").not(this).next().hide(); $(this).next().toggle(); }); });
http://jsbin.com/genifo/edit?html,output
奖励园豆：5
哇！我大意了，漏了一部分..
