我有一个订单表单,用户根据用户的选择选择图像质量(来自下拉列表),项目类型(来自单选按钮),光面完成(复选框检查然后是$ 1)和数量(文本框)点击计算按钮,所选项目文本框的成本应填入总金额。
(qualityofimage) 硬拷贝海报咖啡杯T恤(项目类型)
好8.99 9.99 10.99 11.99 非常好9.99 10.99 11.99 12.99 优秀10.99 11.99 12.99 13.99
例如: 如果图像质量良好,则项目类型为硬拷贝,检查光面处理,数量为1: 总金额=(8.99 + 1)* 1.
我是javascript的新手,并尝试使用二维数组来计算数量,但没有得到正确的结果。感谢任何帮助。
HTML code:
<form id="orderform" name="orderform">
<!--Order form-->
<div id="items">
Types of items
<input type="radio" id="items" name="items" value="1" >Hard-copy Prints
<input type="radio" id="items" name="items" value="2" >Posters
<input type="radio" id="items" name="items" value="3" >Coffee Mugs
<input type="radio" id="items" name="items" value="4" >T-shirts
</div>
<div id="qualityofimage">
Quality of Images
<select name="quality" id="quality">
<option value="1" selected>Good</option>
<option value="2">Very Good</option>
<option value="3">Excellent</option>
</select>
</div>
<div>
Glossy finish
<input type="checkbox" name="gf" id="gf">
</div>
<div>Quantity
<input type="text" id ="qty" name="qty" size="5">
</div>
<div><input type="button" id="calculate" value="Calculate" onclick="display()"></div>
<div>Total
<input type="text" id="cost" name="cost" readonly="readonly">
</div>
</form>
的Javascript
var array=[[8.99,9.99,10.99],[9.99,10.99,11.99],[10.99,11.99,12.99],[11.99,12.99,13.99]];
function display()
{
var row = document.querySelector('input[name="quality"]:selected').value;
var column = document.querySelector('input[name="items"]:checked').value;
var gf=document.getElementById("gf");
var qty=document.getElementById("qty").value;
var total=0;
if(gf.checked)
{
total= (array[row][column]+1)*qty;
}
else
{
total= (array[row][column])*qty;
}
document.getElementById("cost").value = total;
}
答案 0 :(得分:0)
只有一个问题::selected
是jQuery selector,因此无法与document.querySelector
一起使用。
您可能正在寻找$("select option:selected")
。
所以,它是:
var row = $('select option:selected').val();
一旦我改变了它,它运作良好。