在Javascript中将下拉字段乘以文本字段
Trying to create a calculator of sorts by using drop-down menus and quantities. How can I multiply the value from a drop-down to a text field, and have the result show up in another text field, using Javascript? This would apply to each line in the table.
尝试使用下拉菜单和数量创建各种计算器。如何将下拉值与文本字段相乘,并使用Javascript将结果显示在另一个文本字段中?这将适用于表中的每一行。
HTML:
<table width="594" border="1">
<tr>
<th colspan="2" scope="col"><strong>Line Breakdown</strong></th>
<th colspan="2" scope="col"><strong>Qty</strong></th>
<th width="90" scope="col">Unit Line Cost</th>
<th width="90" scope="col">Total Line Cost</th>
</tr>
<tr>
<td width="122"><strong>Cabinets</strong></td>
<td width="150"><select name="DDcabinets" id="DDcabinets">
<option value="">Select an option …</option>
<option value="100">Dura Supreme</option>
<option value="110">Lenape Village</option>
<option value="120">Wellborn Forest</option>
</select></td>
<td width="65"><input type="text" name="Qcabinets" id="Qcabinets" size="10" maxlength="5"/></td>
<td width="41">ft.</td>
Javascript:
window.onload = function () {
var select1 = document.getElementById('DDcabinets');
var input1 = document.getElementById('Vcabinets');
select1.onchange = function () {
input1.value = select1.value;
};
I added this Javascript, but it's not working - I'm guessing my Javascript math is a bit off (that and I'm just really unfamiliar with the coding.)
我添加了这个Javascript,但是它不起作用 - 我猜我的Javascript数学有点不对(我真的不熟悉编码。)
var total1 = document.getElementById('Tcabinets');
var qty1 = document.getElementsById('Qcabinets');
qty1.onchange = function () {
total1.value = select1.value * qty1.value;
};
Also see http://jsbin.com/dodew/2/edit for the full script. [NOTE: You may have to adjust the size of the "Output" column to see the entire table of dropdowns and textfields.]
另请参阅http://jsbin.com/dodew/2/edit以获取完整脚本。 [注意:您可能需要调整“输出”列的大小以查看整个下拉列表和文本字段表。]
2 个解决方案
#1
1
Okay so you're SUPER close, great job! The two things that you need to take note of are this.
好的,所以你非常亲密,干得好!你需要注意的两件事是这个。
// getElement(s)ById, no such thing! Change it to getElementById
var qty1 = document.getElementsById('Qcabinets');
The next thing, is the element values are stored as string
, you need to convert them to integral values, I tend to do this with parseFloat, but parseInt is just as good of a choice.
接下来,将元素值存储为字符串,您需要将它们转换为整数值,我倾向于使用parseFloat,但parseInt也是一个好选择。
Just change your multiplication to convert the strings to integrals, and you're fine!
只需更改你的乘法就可以将字符串转换为积分,你就没事了!
total1.value = parseFloat(select1.value) * parseFloat(qty1.value);
更多相关文章
- 如何在单元格中添加colspan和文本?
- 从打印页面中删除网址并打印文本
- 如何在Python Django中附加数组字段
- Pandas 文本数据方法 findall( )
- flask-admin 新增功能关联两张表,关联的表中的字段显示出来是对象
- 通过分隔符计数和位置从数据框中提取特定文本
- Python自然语言处理学习笔记(3):1.1 语言计算:文本和单词
- Python Flask WTForms:如何在视图中动态禁用字段?
- FieldErro:无法将关键字'date_added'解析为字段。选项包括:data_ad