一、Jquery 在点击列表中的一项时,获取该点击列表项中的相应值
(1)代码
<style>
ul li{
display: block;
border: 1px solid #ccc;
padding: 20px;
margin:0 auto;
margin-top: 5px;
cursor: pointer;
}
#bottom{
width: 350px;
height: 100px;
background: #eee;
margin: auto;
padding: 10px 20px;
}
</style>
<body>
<ul id="products">
<li>
<p>产品一</p>
<span>积分7200</span>
</li>
<li>
<p>产品二</p>
<span>积分3500</span>
</li>
<li>
<p>产品三</p>
<span>积分4500</span>
</li>
<li>
<p>产品四</p>
<span>积分3600</span>
</li>
</ul>
<!--这里是底部-->
<div id="bottom">
产品名称:<span id="name"></span><br />
积分:<span id="total"></span>
</div>
</body>
<script>
$('#products li').click(function(){
aa=$(this).find('p').text();
bb=$(this).find('span').html();
$('#name').text(aa);
$('#total').text(bb);
});
</script>
(2)效果图