如何让Javascript方法在我的HTML中打印
我真的很沮丧试图让我的html和javascript代码一起工作。我正在尝试从storeClientData（）获取用户信息，以便在reservationMessage顶部打印。在过去的4个小时里，我一直在做这件事，运气不好。任何帮助都将不胜感激 我想得到一个输出，显示如下： 先生名、姓氏、街道、城市、省/州、国家、联系方式 然后： 车辆尺寸和价格、选项（例如导航）、持续时间（以天为单位）、租赁成本如何让Javascript方法在我的HTML中打印,javascript,html,css,Javascript,Html,Css,我真的很沮丧试图让我的html和javascript代码一起工作。我正在尝试从storeClientData（）获取用户信息，以便在reservationMessage顶部打印。在过去的4个小时里，我一直在做这件事，运气不好。任何帮助都将不胜感激 我想得到一个输出，显示如下： 先生名、姓氏、街道、城市、省/州、国家、联系方式 然后： 车辆尺寸和价格、选项（例如导航）、持续时间（以天为单位）、租赁成本 <!DOCTYPE html> <html> <head>
<!DOCTYPE html>
<html>
<head>
<title>Dodgy Brakes Car Rental</title>
<meta charset="utf-8" />
<link href="new.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="processregistration.js"></script>
</head>
<center>
<img src="logo.jpg" height="250" width="auto">
</center>
<body>
<center>
<form name=costEstimation>
<table>
<tr>
<td>
<select required id="honorific">
<option value=None>None</option>
<option value=Mr.>Mr.</option>
<option value=Mrs.>Mrs.</option>
<option value=Ms.>Ms.</option>
<option value=Dr.>Dr.</option>
</select>
</td>
</tr>
<tr>
<td>
<input type="text" pattern ="[a-zA-Z0-9-\s]{2,20}$" placeholder="First Name" id="firstName">
<input type="text" pattern ="[a-zA-Z0-9-\s]{2,20}$" placeholder="Last Name" id="lastName">
</td>
</tr>
<tr>
<td>
<input type="text" pattern="[a-zA-Z0-9-\s]{2,25}" placeholder="Street" id="street">
<input type="text" pattern="[a-zA-Z0-9-\s]{2,25}" placeholder="City" id="city">
</td>
</tr>
<tr>
<td>
<input type="text" pattern="[a-zA-Z0-9-\s]{2,25}" placeholder="State/Province" id="stateProvince">
<input type="text" pattern="[a-zA-Z0-9-\s]{2,25}" placeholder="Country" id="country">
</td>
</tr>
<tr>
<td>
<input type="text" placeholder="Business Number" pattern="\d{3}[\-]\d{3}[\-]\d{4}" id="businessNumber">
<input type="text" placeholder="Home Number" pattern="\d{3}[\-]\d{3}[\-]\d{4}" id="homeNumber">
</td>
</tr>
<tr>
<td>
<input type = "email" pattern = "[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,5}$" placeholder="E-mail" id="emailAddress">
</td>
</tr>
<tr>
<td>
<center>
<input type=button value="Register" onClick="showReservations(); return false;">
<input type = "reset" value = "Reset">
</center>
</td>
</tr>
</table>
<div id="reservations" style="display:none;">
<h3>Reservation Form</h3>
<table>
<tr>
<td>
<center>
<h4><u>Type of Vehicle</u></h4>
<input type=radio name=type value=25>Small $25.00<br>
<input type=radio name=type value=35>Midsize $35.00<br>
<input type=radio name=type value=45>Full-sized $45.00<br>
<input type=radio name=type value=50 >Van $50.00<br>
</center>
</td>
</tr>
<tr>
<td>
<center>
<h4><u>Additional Options</u></h4>
<input type=checkbox name=navigationSystem value= "10" >Navigation System $10.00<br>
<input type=checkbox name=childSeat value="5" >Child Seat $5.00<br>
<input type=checkbox name=roofRack value="15" >Roof Rack $15.00<br>
<input type=checkbox name=bicycleRack value="15" >Bicycle Rack $15.00<br>
</center>
</td>
</tr>
<tr>
<td>
<center>
<br>
<input type="text" placeholder="Enter Days" id="duration">
<input type=button value="Calculate" onClick="calculateRental(); showFinal(); return false;">
</center>
</td>
</tr>
</table>
</div>
<div id="showFinal" style="display:none;">
<h3><span id="reservationResult"; </span></h3>
</div>
</form>
</center>
</body>
</html>
var customerData=[];
function storeClientData(){
var honorific=document.getElementById("honorific").value
customerData[0]=honorific;
var firstName=document.getElementById("firstName").value;
customerData[1]=firstName;
var lastName=document.getElementById("lastName").value;
customerData[2]=lastName;
var street=document.getElementById("street").value;
customerData[3]=street;
var city=document.getElementById("city").value;
customerData[4]=city;
var stateProvince=document.getElementById("stateProvince").value
customerData[5]=stateProvince;
var country=document.getElementById("country").value;
customerData[6]=country;
var businessNumber=document.getElementById("businessNumber").value;
customerData[7]=businessNumber;
var homeNumber=document.getElementById("homeNumber").value;
customerData[8]=homeNumber;
var emailAddress=document.getElementById("emailAddress").value;
customerData[9]=emailAddress;
var customerMessage = (customerData[0] + customerData[1] + " " + customerData[2]
+ "<br>" + customerData[3]
+ "<br>" + customerData[4]
+ "<br>" + customerData[5]
+ "<br>" + customerData[6]
+ "<br>" + customerData[7]
+ "<br>" + customerData[8]
+ "<br>" + customerData[9]);
document.getElementById("customerResult").innerHTML = customerMessage;
setFormToEdit();
}
function calculateRental(){
var carSize = parseFloat(0);
var extraAmount = parseFloat(0);
var totalCost = parseFloat(0);
var message = " ";
var reservationMessage = " ";
var duration = parseFloat(0)
for (x = 0; x<document.costEstimation.type.length; x++){
if(document.costEstimation.type[x].checked){
carSize = document.costEstimation.type[x].value;
}
}
carSize = parseFloat(carSize);
if(document.costEstimation.navigationSystem.checked){
extraAmount += parseFloat(document.costEstimation.navigationSystem.value);
message = (message + " Navigation system");
}if (document.costEstimation.childSeat.checked){
extraAmount += parseFloat(document.costEstimation.childSeat.value);
message = (message + " Child seat");
}if (document.costEstimation.roofRack.checked){
extraAmount += parseFloat(document.costEstimation.roofRack.value);
message = (message + " Roof rack");
}if (document.costEstimation.bicycleRack.checked){
extraAmount += parseFloat(document.costEstimation.bicycleRack.value);
message = (message + " Bicycle rack");
}
duration = (document.getElementById("duration").value);
duration = parseFloat(duration)
totalCost = (duration*carSize)+(duration*extraAmount);
reservationMessage += ("Car Information:" + "<br>" + "Rental cost: " + carSize + "<br>" + "Additional Options: " + message + "<br>" + "Total cost: " + totalCost);
document.getElementById("reservationResult").innerHTML = reservationMessage;
}
function setFormToEdit() {
document.getElementById("honorific").readOnly=false;
document.getElementById("firstName").readOnly=false;
document.getElementById("lastName").readOnly=false;
document.getElementById("street").disabled=false;
document.getElementById("city").readOnly=false;
document.getElementById("stateProvince").readOnly=false;
document.getElementById("country").disabled=false;
document.getElementById("homeNumber").readOnly=false;
document.getElementById("businessNumber").readOnly=false;
document.getElementById("emailAddress").disabled=false;
}
function showReservations() {
document.getElementById("reservations").style.display = "block";
}
function showFinal() {
document.getElementById("showFinal").style.display = "block";
}
狡猾的汽车租赁公司
没有一个
先生
夫人
太太
博士
预订表
车辆类型
小型25.00美元
中型35.00美元
全尺寸$45.00
面包车$50.00
附加选项
导航系统$10.00
儿童座椅$5.00
车顶行李架$15.00
自行车架$15.00
var customerData=[]；
函数storeClientData（）{
var honorific=document.getElementById（“honorific”）.value
customerData[0]=敬语；
var firstName=document.getElementById（“firstName”）.value；
customerData[1]=名字；
var lastName=document.getElementById（“lastName”）.value；
customerData[2]=姓氏；
var street=document.getElementById（“street”）.value；
客户数据[3]=街道；
var city=document.getElementById（“城市”）.value；
客户数据[4]=城市；
var stateProvince=document.getElementById（“stateProvince”）.value
customerData[5]=州/省；
var country=document.getElementById（“国家”）.value；
customerData[6]=国家/地区；
var businessNumber=document.getElementById（“businessNumber”）.value；
customerData[7]=业务编号；
var homeNumber=document.getElementById（“homeNumber”）.value；
customerData[8]=家庭号码；
var emailAddress=document.getElementById（“emailAddress”）.value；
customerData[9]=电子邮件地址；
var CarSize=document.querySelector（'input[name=“type”]：checked'）。值；
customerData[10]=车辆尺寸；
var prices=document.getElementsByClassName（'additionclass'）；
var str=“”；
对于（变量i=0；i”+客户数据[3]
+“
”+客户数据[4]
+“
”+客户数据[5]
+“
”+客户数据[6]
+“
”+客户数据[7]
+“
”+客户数据[8]
+“
”+客户数据[9]
+“
”+客户数据[10]
+“
”+客户数据[11]
+“
”+客户数据[12]
);
calculateRental（）；
document.getElementById（“customerResult”）.innerHTML=customerMessage；
setFormToEdit（）；
}
函数calculateRental（）{
var carSize=parseFloat（0）；
var extraAmount=parseFloat（0）；
var totalCost=parseFloat（0）；
var message=“”；
var reservationMessage=“”；
var duration=parseFloat（0）
对于（x=0；x“+”租赁成本：“+carSize+”
“+”其他选项：“+message+”
“+”总成本：“+totalCost”）；
document.getElementById（“reservationResult”）.innerHTML=reservat