Javascript 将输入字段乘以数字值
Javascript multiply input field by a number value
我正在尝试将输入字段"full_day"上的用户输入乘以"var fullprice"，并在只读输入字段"total_full"中显示结果 我做错了什么导致它不起作用？
<div id="wrapper">
<div id="header"></div>
<table width="899" border="1" align="left" cellpadding="1">
<form action="" method="get" name="myform">
<tr>
<td width="275"><label>Company Name</label></td>
<td width="180"><input type="text" name="companyname" id="companyname" /></td>
<td width="27"> </td>
<td width="223">Enquiry Date</td>
<td width="160"><input type="text" name="enquiry_date" id="enquiry_date" class="datepicker" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Conference Date In</td>
<td><input type="text" name="conference_date_in" id="conference_date_in" class="datepicker" /></td>
<td> </td>
<td>Conference Date Out</td>
<td><input type="text" name="conference_date_out" id="conference_date_out" class="datepicker" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Number of Delegates</td>
<td><input type="text" name="no_of_delegates" id="no_of_delegates" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Accommodation:</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><p>Check in Date</p></td>
<td><input type="text" name="check_in_date" id="check_in_date" class="datepicker" /></td>
<td><p> </p></td>
<td><p>Check out Date</p></td>
<td><p>
<input type="text" name="check_out_date" id="check_out_date" class="datepicker" />
</p></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td>Total Days Accommodation</td>
<td><input type="text" name="total_days_acc" id="total_days_acc" /></td>
</tr>
<tr>
<td>Number of Rooms:</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Single</td>
<td><input type="text" name="no_of_rooms_single" id="no_of_rooms_single" /></td>
<td> </td>
<td>Double / Twin</td>
<td><input type="text" name="no_of_rooms_double" id="no_of_rooms_double" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Contact Person</td>
<td><input type="text" name="contact_person" id="contact_person" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Telephone Number</td>
<td><input type="text" name="tel_no" id="tel_no" /></td>
<td> </td>
<td>Fax Number</td>
<td><input type="text" name="fax_no" id="fax_no" /></td>
</tr>
<tr>
<td>Cell Number</td>
<td><input type="text" name="cell_no" id="cell_no" /></td>
<td> </td>
<td>Email</td>
<td><input type="text" name="email" id="email" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Full Day Conference @ R260.00 p/p</td>
<td><input type="text" name="full_day" id="full_day" /></td>
<td> </td>
<td>Total Full Day</td>
<td><input type="text" name="total_full" id="total_full" readonly="readonly" /></td>
</tr>
<tr>
<td>Half Day Conference @ R240.00 p/p</td>
<td><input type="text" name="half_day" id="half_day" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Single Rooms @ R480.00 p/p</td>
<td><input type="text" name="single_rooms" id="single_rooms" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Double / Twin Rooms @ R720.00 p/p</td>
<td><input type="text" name="double_rooms" id="double_rooms" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Data Projector @ R400.00 rental p/day</td>
<td><input type="text" name="data_proj" id="data_proj" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Sub Total</td>
<td><input type="text" name="sub_total" id="sub_total" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</form>
</table>
</div>
</body>
</html>
<script type="text/javascript">
$(function() {
$(".datepicker").datepicker({ minDate: -0, maxDate: "+100M +10D",dateFormat: 'dd-mm-yy'})
({
changeMonth: true,
changeYear: true,
});
});
var enquiry_date = $.datepicker.formatDate('dd-mm-yy', new Date());
document.getElementById('enquiry_date').value = enquiry_date;
var calcDate = function() {
var start = $('#conference_date_in').datepicker('getDate');
var end = $('#conference_date_out').datepicker('getDate');
var days = (end - start) / 1000 / 60 / 60 / 24;
if(days==0) days=1
if( days >= 0 ) {
document.getElementById('total_days').value = days;
}
}
$('#conference_date_out').change(calcDate);
$('#conference_date_in').change(calcDate);
var calcDateAcc = function() {
var startacc = $('#check_in_date').datepicker('getDate');
var endacc = $('#check_out_date').datepicker('getDate');
var daysacc = (endacc - startacc) / 1000 / 60 / 60 / 24;
if(daysacc==0) daysacc=1
if( daysacc >= 0 ) {
document.getElementById('total_days_acc').value = daysacc;
}
}
$('#check_in_date').change(calcDateAcc);
$('#check_out_date').change(calcDateAcc);
function calculateFull()
{
var fulldays = document.getElementById("full_day").value;
var fullprice = 260;
var result = fulldays * fullprice;
document.getElementById("total_full").innerHTML = result;
}
$('#full_day').change(calculateFull);
</script>
total_full是输入框，所以你应该设置值而不是innetHTML
document.getElementById("total_full").innerHTML = result;
document.getElementById("total_full").value = result;
document.getElementByid("full_day").value返回一个字符串。在将其乘以 fullprice 之前，您必须将此字符串转换为数字
var fulldays = parseInt(document.getElementById("full_day").value, 10);
并改变document.getElementById("total_full").innerHTML = result;到document.getElementById("total_full").value = result;
相关文章：
- 我如何在数字插入中使用逗号，这样它就不会'不要破坏我的输入字段
- 输入字段，只接受0到12之间的数字
- 如何限制一个字段只接受4个数字字符作为输入，并获得'It’这是潜水警报
- angularjs在数字(html5）字段中将0转换为1
- 简单的Javascript方式，在输入字段的每5位数字后添加一个空格
- AngularJs:在数字输入字段中设置验证的条件最小值和最大值
- 在粘贴事件Javascript的输入字段中删除所有非数字字符
- 如何使文本、数字和日期html输入字段以一致的方式支持Ctrl+Z(撤消）
- 如何从动态输入字段添加数字
- 要检查的正则表达式数值字段没有 /或具有所有相同的数字
- 如何在javascript中获取隐藏字段的数字和
- OData:对url请求中的数字(ID）字段进行通配符(startswith）筛选
- 根据输入字段中键入的数字更改td单元格的颜色
- 如何使用鼠标或触摸更改数字输入字段
- 将字符串返回到类型为“0”的输出字段;数字“;针对用户错误javascript
- 使用输入数字值作为另一个字段的输入数字最大值
- 我如何在文本输入字段中输入数字，而无需在 JavaScript 或 jQuery 中输入模式
- Angular2:仅包含数字的字段的自定义验证
- 从 JSON 解析数组，其中每个字段键都是一个数字
- Javascript 将输入字段乘以数字值
