我一直在寻找这个问题的解决方案大约3天无济于事。所以我决定发一个关于它的问题。
在这种形式中,我试图从两个表单元素中获取数据,找出一个百分比,并将该数据输入到文本输入和隐藏的输入元素中。
HTML
<head><script type="text/javascript" src="vali.js" async></script></head>
<body onload="hideTotal()">
<form class="form-horizontal" id="req_serv" name="req_serv" method="post" action="index.php">
<label>Order Total :</label>
<input class="form-control" id="ordertot" type="number" name="ordertot" placeholder="$0.00" onkeyup="calculateTotal()" />
<span class="error"><?php echo $ordertotError;?></span>
<label>Service & Fee</label>
<select class="form-control" id="servfee" name="servfee" onchange="calculateTotal()">
<option value="none">Select Service</option>
<option value="ref_thou_less">Refunds</option>
<option value="ref_thou_more">Refunds++</option>
<option value="rep_thou_less">Replacements</option>
<option value="rep_thou_more">Replacements++</option>
<option value="dbl_reprep_thou_less">Double Dip</option>
<option value="dbl_reprep_thou_more">Double Dip++</option>
<option value="dbl_repref_thou_less">Double Dip+++</option>
<option value="dbl_repref_thou_more">Double Dip++++</option>
</select>
<br/>
<label>What You Pay: </label>
<input type="number" required="required" id="totalPrice" name="tp">
<input class="submit" type="submit" name="submit" value="Submit">
<span class="success"><?php echo $successMessage;?></span>
</form>
</body>
JS
var service_fee=new Array();
service_fee["none"]=0;
service_fee["ref_thou_less"]=7.5;
service_fee["ref_thou_more"]=12.5;
service_fee["rep_thou_less"]=10;
service_fee["rep_thou_more"]=15;
service_fee["dbl_reprep_thou_less"]=17.5;
service_fee["dbl_reprep_thou_more"]=27.5;
service_fee["dbl_repref_thou_less"]=15;
service_fee["dbl_repref_thou_more"]=25;
//This function finds the service type price based on the
//drop down selection
function getServicePrice()
{
var ServicePrice=0;
//Get a reference to the form id="req_serv"
var theForm = document.forms["req_serv"];
//Get a reference to the select id="servfee"
var selectedservtype = theForm.elements["servfee"];
ServicePrice = service_fee[selectedservtype.value];
//finally we return service price
return ServicePrice;
}
function calculateTotal()
{
//Here we get the total price by calling our function
//Each function returns a number so by calling them we add the values they return together
var reqservfee = getServicePrice() * 100 / getOrderTotal();
//display the result
var txtobj = document.getElementById('totalPrice');
txtobj.style.display='block';
txtobj.value = reqservfee;
}
function hideTotal()
{
var txtobj = document.getElementById('totalPrice');
txtobj.style.display='none';
}
答案 0 :(得分:1)
getOrderTotal
中未定义 script
var service_fee = {};
service_fee["none"] = 0;
service_fee["ref_thou_less"] = 7.5;
service_fee["ref_thou_more"] = 12.5;
service_fee["rep_thou_less"] = 10;
service_fee["rep_thou_more"] = 15;
service_fee["dbl_reprep_thou_less"] = 17.5;
service_fee["dbl_reprep_thou_more"] = 27.5;
service_fee["dbl_repref_thou_less"] = 15;
service_fee["dbl_repref_thou_more"] = 25;
function getServicePrice() {
var ServicePrice = 0;
var theForm = document.forms["req_serv"];
var selectedservtype = theForm.elements["servfee"];
ServicePrice = service_fee[selectedservtype.value];
return ServicePrice;
}
function getOrderTotal() {
return document.getElementById('ordertot').value;
}
function calculateTotal() {
var reqservfee = (getServicePrice() / 100) * getOrderTotal();
var txtobj = document.getElementById('totalPrice');
txtobj.style.display = 'block';
txtobj.value = reqservfee;
}
function hideTotal() {
var txtobj = document.getElementById('totalPrice');
txtobj.style.display = 'none';
}
&#13;
<body onload="hideTotal()">
<form class="form-horizontal" id="req_serv" name="req_serv" method="post" action="index.php">
<label>Order Total :</label>
<input class="form-control" id="ordertot" type="number" name="ordertot" placeholder="$0.00" onkeyup="calculateTotal()" />
<span class="error"><?php echo $ordertotError;?></span>
<label>Service & Fee</label>
<select class="form-control" id="servfee" name="servfee" onchange="calculateTotal()">
<option value="none">Select Service</option>
<option value="ref_thou_less">Refunds</option>
<option value="ref_thou_more">Refunds++</option>
<option value="rep_thou_less">Replacements</option>
<option value="rep_thou_more">Replacements++</option>
<option value="dbl_reprep_thou_less">Double Dip</option>
<option value="dbl_reprep_thou_more">Double Dip++</option>
<option value="dbl_repref_thou_less">Double Dip+++</option>
<option value="dbl_repref_thou_more">Double Dip++++</option>
</select>
<br/>
<label>What You Pay:</label>
<input type="number" required="required" id="totalPrice" name="tp">
<input class="submit" type="submit" name="submit" value="Submit">
<span class="success"><?php echo $successMessage;?></span>
</form>
</body>
&#13;