如何获取按钮当前下的内容

2014-04-19

怎么获取按钮当前下的内容


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $(".in_btn").click(function(){
$(".div_b").css('display','none');
$(".div_x").css('display','block');
})
});
</script>
<style type="text/css">
*{
margin:0;
padding:0;
}
.div{
width:560px;
height:400px;
float:left;
border:1px solid #069;
}
.div_x,.div_b{
width:500px;
height:350px;
float:left;
border:1px solid #000;
margin:20px 0 0 20px;
display:inline;
}
.div_b{
display:block;
}
.div_x{
display:none;
}
</style>
</head>

<body>
<div class="div">
 <div class="div_b">
  <input class="in_btn" type="button" value="11111" />
  <input class="in_btn" type="button" value="22222" />
 </div>
 <div class="div_x">
 11111111
 </div>
 <div class="div_x">
 2222222
 </div>
</div>
</body>
</html>

怎么样才能获取到当我点击value="11111"的按钮时候显示111111的内容<div class="div_b">隐藏而点击value="22222"的按钮时候显示22222的内容 <div class="div_b"> 以此类推应该怎么写啊
[解决办法]
$(".in_btn").click(function () {
$(".div_x:contains(" + $(this).attr("value") + ")").toggle();
})
[解决办法]
4楼那个有点问题，按照4楼那个改了一下，这样可以的。。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $(".in_btn").click(function () {
$(".div_x").hide();
$(".div_x:contains(" + $(this).attr("value") + ")").show();
})
});
</script>
<style type="text/css">
*{
    margin:0;
    padding:0;
    }
.div{
    width:560px;
    height:400px;
    float:left;
    border:1px solid #069;
    }
.div_x,.div_b{
    width:500px;
    height:350px;
    float:left;
    border:1px solid #000;
    margin:20px 0 0 20px;
    display:inline;
    }
.div_b{
    display:block;
    }
.div_x{
    display:none;
    }
</style>
</head>
 
<body>
<div class="div">
 <div class="div_b">
  <input class="in_btn" type="button" value="11111" />
  <input class="in_btn" type="button" value="22222" />
 </div>
 <div class="div_x">
 11111111
 </div>
 <div class="div_x">
 2222222
 </div>
</div>
</body>
</html>

热点排行

JavaScript

如何获取按钮当前下的内容