$(document).ready(function () {
$("#knop").click(function () {
var pizzas = ["Margherita", "Napolitana", "Salami", "Prosciutto", "Funghi", "Tonno"];
var Prijs = ["6.00", "7.20", "7.50", "7.50", "7.00", "8.00"];
if ($('input[name="M"]').is(":checked")) {
$("#Pizza").html(pizzas[0]);
$("#prijs").html(Prijs[0]);
};
if ($('input[name="N"]').is(":checked")) {
$("#Pizza").html(pizzas[1]);
$("#prijs").html(Prijs[1]);
};
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="Pizzas container" id="checkbox_pizza">
<h1>Kies uw Pizza.</h1>
<form>
<input type="checkbox" name="M" id="g" value="0"> €6,00 -Margherita (Kaas en tomaten)
<br/>
<input type="checkbox" name="N" id="h" value="1"> €7,20 -Napolitana (tomaten, kaas, kappertjes, ansjovis)
<br/>
<input type="checkbox" name="S" id="i" value=2""> €7,50 -Salami (kaas, tomaten en salami)
<br/>
<input type="checkbox" name="P" id="j" value="3"> €7,50 -Prosciutto (tomaten, kaas, ham)
<br/>
<input type="checkbox" name="F" id="k" value="4"> €7,00 -Funghi (tomaten, kaas, champions)
<br/>
<input type="checkbox" name="T" id="l" value="5"> €8,00 -Tonno (tomaten, kaas, tonijn, ui)
<br/>
<input type="button" id="knop" value="knop"/>
<p id="Pizza"></p><p id="prijs"></p>
</form>
</div>
Here is my html and jquery code. Now my problem is that when I have checked the first and second checkboxes and click the #knop button, I only see the second checkbox results in my <p>
.
Now I know this is because of the second part of my function, but how do I get it so that both the result will show?
Aucun commentaire:
Enregistrer un commentaire