如果同一页面上有多个元素使用相同的ID,jQuery将计算价格
jQuery calculating price if many elements on same page using same IDs?
我在每个产品的一个页面上都有12个这样的表单。它允许某人输入数量并让它计算价格,但还不起作用。新的价格应该取代orderprice
类中的价格。
<form action="" method="post">
<input type="number" id="amount-<?php echo $productId; ?>" class="orderamount" name="amount" value="1" min="1" max="2000" maxlength="4" />
<input type="hidden" name="product" value="<?php echo $productId; ?>" readonly="readonly" disabled="disabled" />
<div id="price-<?php echo $productId; ?>" class="orderprice">
<?php
echo html_entity_decode($currencyAlignCode) . round($productPrice * $currencyMultiplier, 2);
?>
</div>
<input type="submit" class="addcart" value="" name="order" />
</form>
我想取amount-<?php echo $productId; ?>
的值,通过将该值乘以$productPrice
再乘以$currencyMultiplier
来自动计算价格,然后在其前面加上html_entity_decode($currencyAlignCode)
。
如果页面上只有一个表单,并且我不需要说明<?php echo $productId; ?>
,我知道如何做到这一点。这是我对单个表单的处理方式,但我如何对多个表单进行处理?每个价格只会从相关的输入框中获取数量?
$(document).ready(function() {
$("#amount").bind('click keyup', function(event) {
var amount = $("#amount").val();
var productPrice = <?php echo $productPrice; ?>;
var currencyMultiplier = <?php echo $currencyMultiplier; ?>;
var currencyCode = <?php echo html_entity_decode($currencyAlignCode); ?>;
var totalPrice = amount * productPrice * currencyMultiplier;
$("#price").html('currencyCode' + totalPrice);
});
});
此代码只对1个产品执行此操作。我希望每个人的输入都显示在各自的价格框中。
很抱歉,如果不清楚的话,这有点难以解释。
也许是这样的?使用多个选择器或抓取以某个内容开头的选择器。
<input type="number" id="amount-<?php echo $productId; ?>" productPrice="<?php echo $productPrice; ?>" ...
$("[id^=amount]").each(function(index){
$(this).bind("click key up", function(){
var amount = $(this).val();
var productPrice = $(this).attr('productPrice');
...
});
});
https://api.jquery.com/each/
http://api.jquery.com/attribute-starts-with-selector/
我最终在谷歌上进行了大量搜索并找到了解决方案。
我使用attr来获取基于更改的类的id。
$(document).ready(function() {
$(".orderamount").bind('click keyup', function(event) {
var productId = $(this).attr('id');
var setId = productId.substring(7);
var amount = $('#amount-' + setId).val();
var productPrice = <?php echo $productPrice; ?>;
var currencyMultiplier = <?php echo $currencyMultiplier; ?>;
var currencyCode = <?php echo html_entity_decode($currencyAlignCode); ?>;
var totalPrice = round(amount * productPrice * currencyMultiplier, 2);
$('#price-' + setId).html('currencyCode' + totalPrice);
});
});
相关文章:
- 是否有一个JS/jQuery函数可以获取某个类的每个元素的ID
- 获取打开jquery对话框的button的id
- jQuery mobile not going through ID
- 如何将li类更改为li id's在Jquery中
- 如何使用jQuery迭代id名称的变体(如idname1、idname2)
- 获取不带Id JQuery的复选框值
- 从ID Jquery类获取返回值时出现问题
- attr() 不会更改 id - jquery
- 通过 ID jquery 限制文本区域字符
- 获取选定的行id jquery数据表行选择
- 如何在asp.net mvc中向Action方法发布简单ID(jquery-ajax)
- 添加文本到Javascript Span id jquery
- 动态获取控件ID - JQuery
- 验证选择字段取决于id jquery
- Increment id jquery
- 使用id jquery中的空格
- 根据HTML表的ID jQuery/javaScript对数据进行排序
- 以引号结束id - jquery
- 当draggable被拖放到可拖放区域时添加ID - jQuery Draggables
- 表格ID &jQuery中的名称