我正试图将价格构建为批发和零售。因此，如果用户点击批发，它应该显示一个包含数量金额的输入，如果用户单击添加到购物车，它应该取批发价格，当点击"批发购买"时，它应该让用户输入他们想要购买的商品数量，并应作为零售价添加到购物篮中。现在，当我点击"购买批发"，并点击添加到购物车时，它会将数量和价格作为批发，但当我点击零售时，它也会将批发价格和数量作为批发。不添加为零售。
<label class="checkbox-inline">
<input type="checkbox" name= "checkbox" id="chk" onclick="ShowHideDiv(this)" value=""> Buy
Wholesale
</label>
<label class="checkbox-inline">
<input type="checkbox" name = "checkbox" id="chk" onclick="ShowHideDiv1(this)" value=""> Buy
Retail
</label>
</div>
<div id="dvPass" style="display: none">
<input name="qty" size="10" type="number" id="txtNumber" value="<?php echo
$single['pro_quantity_stock']?>" disabled />
</div>
<div id="dvPass1" style="display: none">
<input name="qty" size="10" type="number" id="txtNumber1" />
</div>
<a href="#" class="btn btn-info btn-normal" onclick="add_cart_func(<?= $single['id']?>,
'<?=
$single["pro_title"]?>',
'<?= $price?
>')">
<span class="glyphicon glyphicon-shopping-cart"></span> ADD TO CART
</a>
let qty = $("input[name='qty']").val();
问题来了。即使其中一个被隐藏，它仍然在DOM中。试试下面这样的方法。
<script type="text/javascript">
var type = "txtNumber";
function ShowHideDiv(chk) {
var dvPass = document.getElementById("dvPass");
dvPass.style.display = chk.checked ? "block" : "none";
type = "txtNumber";
}
function ShowHideDiv1(chk) {
var dvPass1 = document.getElementById("dvPass1");
dvPass1.style.display = chk.checked ? "block" : "none";
type = "txtNumber1";
}
</script>
和
let qty = $("#"+type).val();