Tôi đang làm việc trên một hệ thống đặt chỗ xe hơi đơn giản cho một dự án năm đầu tiên, là một trong số những người khác giới thiệu về javascript.Giá cập nhật Javascript chọn thay đổi
Trên trang một giá trị người dùng nhập được chuyển đến trang 2 bằng php và javascript của tôi bên dưới đang hoạt động chính xác để tính giá thuê.
My Vấn đề
Tuy nhiên, trên trang 2 người dùng có thể chỉnh sửa đặt phòng của họ, ví dụ: nâng cấp loại xe. Điều gì sẽ dẫn đến tăng hoặc giảm giá tùy thuộc vào người dùng đã chọn carGroup
.
Vấn đề của tôi khi thêm onchange
vào phần tử select
cho carGroup
giá không thay đổi và không nhận được lỗi nào không làm cho tình huống trở nên dễ dàng hơn để gỡ lỗi.
Đoạn mã dưới đây là khá cơ bản, tôi sẽ đánh giá cao nó, nếu ai đó có thể cho nó một quét và có lẽ tư vấn cho nơi tôi đang đi sai.
UI
Javascript
function calcPrice() {
var oneDay = 24 * 60 * 60 * 1000;
var firstDate = document.getElementById("firstDate").value;
var secondDate = document.getElementById("secondDate").value;
var date1 = firstDate.substring(0, 11);
var date2 = secondDate.substring(0, 11);
date1 = date1.replace(/\//g, ",");
date2 = date2.replace(/\//g, ",");
var firstDate = new Date(date1);
var secondDate = new Date(date2);
var diffDays = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay)));
//calculate rental price
var price;
var dayRate;
var carGroup = document.getElementById("group").value;
//change values to increase or decrease price
var a = 250;
var b = 500;
var c = 750;
var d = 1000;
if (carGroup == 'a') {
price = diffDays * a;
dayRate = a;
} else if (carGroup == 'b') {
price = diffDays * b;
dayRate = b;
} else if (carGroup == 'c') {
price = diffDays * c;
dayRate = c;
} else if (carGroup == 'd') {
price = diffDays * d;
dayRate = d;
}
document.getElementById("rentalInfo").innerHTML = diffDays + ' Day Rental, At: ' + dayRate + ' Per Day. <span style="color:red; font-weight:bold"> Total Price: ' + price + '</span>';
}
Html
<select onChange="calcPrice()"name="carType" id="group">
<option selected value="<?php echo $carType ?>"><?php echo $carType?></option>
<option value="a">Group A (Hyundai I10)</option>
<option value="b">Group B (VW POLO)</option>
<option value="c">Group C (Corolla)</option>
<option value="d">Group D (Bakkie)</option>
</select>
</div><!--formGroup-->
JSFIDDLE
I created a JSFIDDLE here, vấn đề duy nhất với JSFIDDLE tôi là chức năng calcPrice()
nên chạy trên <body onload="calcPrice()">
mà tôi nghi ngờ không xảy ra trong JSFIDDLE
HolyMoly cảm ơn rất nhiều – Marilee
niềm vui của tôi! mã hóa hạnh phúc! – HolyMoly