我正在尝试学习一些HTML和JavaScript(主要是使用C#进行学习),并且我得到了一个朋友的测试,目的是建立一个小型网络商店。
我有一些用于不同项目的复选框,目标是如果我组合不同的产品,我将获得折扣。但是,有两个具有相同值的商品需要不同的折扣组合。但是挑战是我不允许编辑html文件。
是否可以通过JavaScript区分这些项目?唯一不同的是<h2>
。
同样,我对JavaScript还是很陌生,但是我确实有一些脚本知识,因此,如果您有解决方案,请对函数的功能进行评论,以便更好地在代码中实现。
HTML和代码: 请注意,这不是全部代码,这是我认为针对此问题相互联系的唯一部分。如果需要完整的脚本,我将为其制作一个pastebin。
$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}
<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>
答案 0 :(得分:1)
在JavaScript中使用document.getElementsByName("fruit")
时,它将返回一个数组;因此,document.getElementsByName("fruit")[0]
返回第一个广播,document.getElementsByName("fruit")[1]
返回第二个广播。
也就是说,您正在使用jQuery,它是JavaScript框架。 jQuery中执行相同操作的语法是稍短的$('[name="fruit"]')
。