我正在学习 JavaScript。我当前的代码似乎适用于总价值,但我无法让我的部门代码发挥作用来显示每人的成本是多少。
这似乎是问题所在:
document.getElementById("costeach").innerHTML = '£' + Price_each;
它返回 NaN 但控制台中没有错误。
var a = document.getElementById("quantity");
var price = a.options[a.selectedIndex].value;
var b = document.getElementById("method");
var type = b.options[b.selectedIndex].value;
if (type == 'credit') {
var price = price * 1.034;
}
var price_each = (price / a);
document.getElementById("cost").innerHTML = '£' + price;
document.getElementById("costeach").innerHTML = '£' + price_each;
.container {
display: inline-block;
position: relative;
width: 200px;
}
.image {
display: block;
width: 100%;
height: auto;
opacity: 0.6;
}
.overlay {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
opacity: 0;
transition: .5s ease;
}
.container .overlay {
opacity: 1;
}
button {
padding: 10px 15px;
cursor: pointer;
}
.text {
color: black;
font-family: arial;
font-size: 50px;
font-weight: bold;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
text-align: center;
}
span {
display: block;
font-size: 12px;
}
<h4>
Booking Form
</h4>
<select id="quantity" name=''>
<option title='Option 2' value='240'>2 people</option>
<option title='Option 3' value='330'>3 people</option>
<option title='Option 4' value='400'>4 people</option>
<option title='Option 3' value='500'>5 people</option>
<option title='Option 4' value='600'>6 people</option>
</select>
<br /> Paypal Funding Method
<br />
<select id="method" name=''>
<option title='Option 1' value='bank'>Bank Transfer</option>
<option title='Option 2' value='debit'>Debit Card</option>
<option title='Option 3' value='credit'>Credit card (+3.4%)</option>
</select>
<br />
<textarea placeholder="Guest names"></textarea>
<br />
<h4>
<b>Total Price</b>
<span id="cost">Hello World!</span>
<b>Price Each</b>
<span id="costeach">Hello World!</span>
</h4>
<button>
Book
</button>
您正在将字符串除以 DOM 元素:
var a = document.getElementById("quantity");
// ...
var price_each = (price / a);
虽然字符串可以自动转换为数字,但 DOM 元素却不能。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)