-3

好的,这是我正在使用的代码:-

<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script>
$(function() {
    $("#rangePoints").change(function() { 
        var qty = $("#rangePoints").val(); 
        var price = $("#price").val();
        $("#qty").val(qty);
        $("#total").val(qty*price);
    });
});
</script>

</head>
<body>
Price: <input id="price" type="text" value="10.50" readonly /><br/> 
Quantity: <input id="qty" type="text" value="1" readonly />
<input id="rangePoints" type="range" min="1" max="100" value="1"/><br/><br/> 

Total Price: <input type="text" id="total" readonly />


Price: <input id="price" type="text" value="15.50" readonly /><br/> 
Quantity: <input id="qty" type="text" value="1" readonly />
<input id="rangePoints" type="range" min="1" max="100" value="1"/><br/><br/> 

Total Price: <input type="text" id="total" readonly />
</body>
</html>

(感谢 charles360 对这个 javascript 的帮助)。

在上面的代码中,只有第一个滑块有效(价格为 10.50)……而……第二个无效。

我需要有多个这样的滑块,每个滑块都必须执行数量 * 价格功能。我将如何做到这一点?

谢谢。

4

1 回答 1

1

你有不同的元素具有相同的id. ids 在页面上应该是唯一的。它只会查找第一个id,因为它们应该只使用一次。

如果您想要可以在页面上多次重复使用的内容,请使用classes 而$(".className")不是$("#idName")

于 2013-07-26T11:30:37.940 回答