Question

如何用jquery写多个购物车的数量曾减，我用jquery写了但只第一个购物车增减有用，其它的无效，代码如下：

<script>
$(function(){
var t = $("#text_box");
$("#add").click(function(){
t.val(parseInt(t.val())+1)
setTotal();
})
$("#min").click(function(){
t.val(parseInt(t.val())-1)
setTotal();
})
function setTotal(){
$("#total").html((parseInt(t.val())*3.95).toFixed(2));
}
setTotal();
})
</script>
<p>单价：3.95</p>
<input id="min" name="" type="button" value="-" />
<input id="text_box" name="" type="text" value="4" />
<input id="add" name="" type="button" value="+" />
<p>总价：<label id="total"></label></p>
<p>单价：3.95</p>
<input id="min" name="" type="button" value="-" />
<input id="text_box" name="" type="text" value="4" />
<input id="add" name="" type="button" value="+" />
<p>总价：<label id="total"></label></p>

Answer 1

这个时候就像前面大哥说的 不能用id来表示了 可以用class
还有你的这个结构是不规范的 id一个页面只能是唯一的
为了不同时改变 其他的购物车的数量 可以来找到相对的

这个结构：
<div>
<p>单价：3.95</p>
<input class="min" name="" type="button" value="-" />
<input class="text_box" name="" type="text" value="4" />
<inputclass="add" name="" type="button" value="+" />
<p>总价：<label class="total"></label></p>
</div>
<div>
<p>单价：3.95</p>
<input class="min" name="" type="button" value="-" />
<input class="text_box" name="" type="text" value="4" />
<input class="add" name="" type="button" value="+" />
<p>总价：<label class="total"></label></p>
</div>

把每个购物车用一个div包起来

js:
$(function(){
//var t = $("#text_box");
$(".add").click(function(){
var t= $(this).parent().find(".text_box"); //根据这个来找到它相对的元素 当然也可以直接 //$(this).prev(); 这个直接来找到
t.val(parseint(t.val()+1);
setTotal($(this),t.val());
})
$(".min").click(function(){
var t= $(this).parent().find(".text_box"); //根据这个来找到它相对的元素 当然也可以直接 //$(this).next(); 这个直接来找到
t.val(parseint(t.val()-1);
setTotal($(this),t.val());
})
function setTotal(obj,number){
var total=number*$(obj).parent().find("p:first").text(); //这里算出总价
$(obj)).parent().find("total").html(total.toFixed(2));
}
// setTotal();
})

给一个建议 以后要想做好东西 布局一定要好

一个好的结构 才能让你任意操作

Answer 2

楼主要知道id这个属性的值是唯一的。每个元素的id值不应该重复。所以应该把id改为class。
比如将id="text_box"改成class="text_box"，jquery选择器也改改:$(".text_box")。还有其他比如说add这些也得改一改。

追问

那这样的话，就同时都改变了呀，我点第一个购物车增加数量，下面几个购物车也同时增加，请问这怎么改

追答

$(".min").click(function(){        
 $(this).sibling(".text_box").val(parseInt($(this).sibling(".text_box").val())-1);//获取class=text_box的兄弟节点。
   })；

add也用同样的方法。

Answer 3

$("#add").click(function(){ //凡是带click的

都改成
$("#add").live("click",function(){})
用live

click只对页面打开时生成的元素有效，操作后由程序后生成的无效