'use strict';
var result = document.getElementById('result');
var but = document.forms.burger.elements.order;
var sizeBurger = document.forms.burger.elements.sizeBurger;
var stuffingStaf = document.forms.burger.elements.stuffingStaf;
var cheese = document.forms.burger.elements.cheese;
var salad = document.forms.burger.elements.salad;
var potato = document.forms.burger.elements.potato;
var mayonez = document.forms.burger.elements.mayonez;
var spice = document.forms.burger.elements.spice;
class Hamburger {
constructor(size, stuffing, topping) {
this.size = size;
this.stuffing = stuffing;
this.topping = topping;
}
static get SMALLPRICE() {
return 50
}
static get LARGEPRICE() {
return 100
}
static get CHEESEPRICE() {
return 10
}
static get SALADPRICE() {
return 20
}
static get POTATOPRICE() {
return 15
}
static get MAYONEZPRICE() {
return 20
}
static get SPICEPRICE() {
return 15
}
addStuffin() {
var stufPrise = 0;
if (this.stuffing == "cheese") {
stufPrise += Hamburger.CHEESEPRICE;
}
if (this.stuffing == 'salad') {
stufPrise += Hamburger.SALADPRICE;
}
if (this.stuffing == "potato") {
stufPrise += Hamburger.POTATOPRICE;
}
return stufPrise;
}
calculatePrice() {
if (this.size == "small") return Hamburger.SMALLPRICE + this.addStuffin();
if (this.size == "large") return Hamburger.LARGEPRICE + this.addStuffin();
else return null;
}
}
but.addEventListener('click', function() {
var burgerNew = new Hamburger(sizeBurger.value);
var stafNew = new Hamburger(stuffingStaf.value);
result.innerHTML = "Buger cost " + burgerNew.calculatePrice() + '$';
console.log(burgerNew.calculatePrice())
console.log(stafNew.addStuffin())
})
<form name="burger">
<fieldset>
<legend>Select size</legend>
<label>
<img src="images/small.jpg" alt=""/>
<input type="radio" name="sizeBurger" value="small"/>
</label>
<label>
<img src="images/large.jpg" alt=""/>
<input type="radio" name="sizeBurger" value="large"/>
</label>
</fieldset>
<fieldset>
<legend>Select stuffing</legend>
<label>
<img src="images/cheese.jpg" alt=""/>
<input type="checkbox" name="stuffingStaf" value="cheese"/>
</label>
<label>
<img src="images/salad.jpg" alt=""/>
<input type="checkbox" name="stuffingStaf" value="salad"/>
</label>
<label>
<img src="images/potato.jpg" alt=""/>
<input type="checkbox" name="stuffingStaf" value="potato"/>
</label>
</fieldset>
<fieldset>
<legend>Select topping</legend>
<label>
<img src="images/mayonez.jpg" alt=""/>
<input type="checkbox" name="mayonez" value="mayonez"/>
</label>
<label>
<img src="images/spice.jpg" alt=""/>
<input type="checkbox" name="spice" value="spice"/>
</label>
</fieldset>
<input type="button" class="button" value="ORDER" name="order" />
</form>
<h3 id="result"></h3>
В вашем коде stuffing конструктор класса принимает вторым параметром, но вы его не передаёте.
var burgerNew = new Hamburger(sizeBurger.value);
var stafNew = new Hamburger(stuffingStaf.value);
замените на
var burgerNew = new Hamburger(sizeBurger.value, stuffingStaf.value);
var stafNew = new Hamburger(sizeBurger.value, stuffingStaf.value);
Плюс поменяте stuffing c checkbox на radio
'use strict';
var result = document.getElementById('result');
var but = document.forms.burger.elements.order;
var sizeBurger = document.forms.burger.elements.sizeBurger;
var stuffingStaf = document.forms.burger.elements.stuffingStaf;
var cheese = document.forms.burger.elements.cheese;
var salad = document.forms.burger.elements.salad;
var potato = document.forms.burger.elements.potato;
var mayonez = document.forms.burger.elements.mayonez;
var spice = document.forms.burger.elements.spice;
class Hamburger {
constructor(size, stuffing, topping) {
this.size = size;
this.stuffing = stuffing;
this.topping = topping;
}
static get SMALLPRICE() {
return 50
}
static get LARGEPRICE() {
return 100
}
static get CHEESEPRICE() {
return 10
}
static get SALADPRICE() {
return 20
}
static get POTATOPRICE() {
return 15
}
static get MAYONEZPRICE() {
return 20
}
static get SPICEPRICE() {
return 15
}
addStuffin() {
var stufPrise = 0;
if (this.stuffing == "cheese") {
stufPrise += Hamburger.CHEESEPRICE;
}
if (this.stuffing == 'salad') {
stufPrise += Hamburger.SALADPRICE;
}
if (this.stuffing == "potato") {
stufPrise += Hamburger.POTATOPRICE;
}
return stufPrise;
}
calculatePrice() {
if (this.size == "small") return Hamburger.SMALLPRICE + this.addStuffin();
if (this.size == "large") return Hamburger.LARGEPRICE + this.addStuffin();
else return null;
}
}
but.addEventListener('click', function() {
var burgerNew = new Hamburger(sizeBurger.value, stuffingStaf.value);
var stafNew = new Hamburger(sizeBurger.value, stuffingStaf.value);
result.innerHTML = "Buger cost " + burgerNew.calculatePrice() + '$';
console.log(burgerNew.calculatePrice())
console.log(stafNew.addStuffin())
})
<form name="burger">
<fieldset>
<legend>Select size</legend>
<label>
<img src="images/small.jpg" alt=""/>
<input type="radio" name="sizeBurger" value="small"/>
</label>
<label>
<img src="images/large.jpg" alt=""/>
<input type="radio" name="sizeBurger" value="large"/>
</label>
</fieldset>
<fieldset>
<legend>Select stuffing</legend>
<label>
<img src="images/cheese.jpg" alt=""/>
<input type="radio" name="stuffingStaf" value="cheese"/>
</label>
<label>
<img src="images/salad.jpg" alt=""/>
<input type="radio" name="stuffingStaf" value="salad"/>
</label>
<label>
<img src="images/potato.jpg" alt=""/>
<input type="radio" name="stuffingStaf" value="potato"/>
</label>
</fieldset>
<fieldset>
<legend>Select topping</legend>
<label>
<img src="images/mayonez.jpg" alt=""/>
<input type="checkbox" name="mayonez" value="mayonez"/>
</label>
<label>
<img src="images/spice.jpg" alt=""/>
<input type="checkbox" name="spice" value="spice"/>
</label>
</fieldset>
<input type="button" class="button" value="ORDER" name="order" />
</form>
<h3 id="result"></h3>
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Какие существуют виды рекламных бордов и как выбрать подходящий?
Допустим при просмотре какого-то постороннего сайта, можно ли добавить свой js-скрипт и ajax-запрос к своему php-скрипту? те
В общем, justify-content:space-between не работает на всю ширину блокаВо всем шаблоне, где бы я не использовал его, будет тоже самое