日期:2014-05-20 浏览次数:20799 次
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//做减法
$(".a").click(function(){
var td=$(this).parent();
var tr=td.parent();
var textbox=tr.find("input");
var count=parseInt(textbox.val());
textbox.val(count-1)
});
//做加法
$(".b").click(function(){
var td=$(this).parent();
var tr=td.parent();
var textbox=tr.find("input");
var count=parseInt(textbox.val());
textbox.val(count+1)
});
});
</script>
<style>
a{text-decoration:none}
</style>
</head>
<body>
<table id="tb" border="1" width="100%">
<tr>
<th>商品名称</th><th>商品价格</th><th>数量</th>
</tr>
<tr>
<td>商品1</td><td>100</td>
<td>
<a class="a" href="javascript:;" >-</a>
<input type="text" value="1" style="width:50px;"/>
<a class="b" href="javascript:;" >+</a>
</td>
</tr>
<tr>
<td>商品2</td><td>200</td>
<td>
<a class="a" href="javascript:;" >-</a>
<input type="text" value="2" style="width:50px;"/>
<a class="b" href="javascript:;" >+</a>
</td>
</tr>
<tr>
<td>商品3</td><td>300</td>
<td>
<a class="a" href="javascript:;" >-</a>
<input type="text" value="3" style="width:50px;"/>
<a class="b" href="javascript:;" >+</a>
</td>
</tr>
<tr>
<td>商品4</td><td>400</td>
<td>
<a class="a" href="javascript:;" >-</a>
<input type="text" value="4" style="width:50px;"/>
<a class="b" href="javascript:;" >+</a>
</td>
</tr>
</body>
</html>