多个选定的索引查询(选择选项菜单)出现问题
Issue with multiple selected index queries (select option menu)
我有 2 个选择选项菜单:
<select name="cylinder" class="cylinder" id="cylinder">
<option value="0" selected="selected">Please select from the options below...</option>
<option value="500">£500 for 230 Litres (2000 x 400 / 2-3 people)</option>
<option value="550">£550 for 260 Litres (1800 x 450 / 2-3 people)</option>
<option value="600">£600 for 290 Litres (2000 x 450 / 3-4 people)</option>
<option value="650">£650 for 320 Litres (1800 x 500 / 4-5 people)</option>
<option value="700">£700 for 350 Litres (2000 x 500 / 5-6 people)</option>
<option value="800">£800 for 512 Litres (2000 x 600 / 6-7 people)</option>
</select>
<select name="heatex" class="cylinder" id="heatex">
<option value="0" selected="selected">Please select from the options below...</option>
<option value="250">£250 for an Internal Mains Coil 110 Kw</option>
<option value="350">£350 for an Internal Mains Coil 110 Kw with Twin Mixer Upgrade</option>
<option value="400">£400 for an Internal Mains Coil 165 Kw</option>
<option value="500">£500 for an Internal Mains Coil 165 Kw with Twin Mixer Upgrade</option>
<option value="700">£700 for an External Plate Exchanger 165</option>
</select>
和以下 JavaScript 代码来存储所选选项的值
function next_section()
{
var a = document.getElementById("cylinder").selectedIndex;
var num = new Number(document.getElementsByTagName("option")[a].value);
var b = document.getElementById("heatex").selectedIndex;
var num2 = new Number(document.getElementsByTagName("option")[b].value);
document.getElementById('total').innerHTML = (num+num2);
}
我有一个按钮来调用该函数:
<img src="buildernext.jpg" onClick="next_section(1)"/>
该函数的目的是更新以下文本:
Basic Thermal Store: £<span id="total">0.00</span>
我的错误/问题:
基本上,如果您在"heatex"选择菜单下选择第 4 个选项,则该函数将从"圆柱体"选择菜单中获取第 4 个选项值。我只能假设我的问题正在尝试获取 2 批选定的索引?我不确定,任何和所有的帮助都值得赞赏。
使用以下方法更改您的 JS 代码:
function next_section()
{
var a = document.getElementById("cylinder");
var num = Number(a.options[a.selectedIndex].value);
var b = document.getElementById("heatex");
var num2 = Number(b.options[b.selectedIndex].value);
document.getElementById('total').innerHTML = (num+num2);
}
您可以使用:
function next_section()
{
var selectA = document.getElementById("cylinder");
var num = selectA.options[selectA.selectedIndex].value;
var selectB = document.getElementById("heatex");
var num2 = selectB.options[selectB.selectedIndex].value;
document.getElementById('total').innerHTML = (num+num2);
}
我认为这对你来说是一个很好的解决方案:(使用jquery(
$('#selectForm').submit(function(e){
e.preventDefault();
next_section();
});
function next_section()
{
var num1 = parseInt($("#cylinder").val());
var num2 = parseInt($("#heatex").val());
$('#total').html(num1+num2);
}
相关文章:
- 使用java脚本更改onClick事件中菜单选项卡的颜色
- Jquery选择菜单选项在页面刷新时失败
- 如何从下拉菜单选项中设置要显示的图像
- jQuery:将按钮过滤器转换为选择菜单选项
- 如何通过单击唯一按钮保存下拉菜单/复选框菜单选项和占位符值
- 动态替换下拉菜单选项jQuery
- 菜单选项卡选择/活动样式取决于url中的file.php、javascript函数
- 如何在用户更改菜单选项时显示不同的文本
- 如何在刷新后激活菜单选项卡
- 筛选具有不同值的下拉菜单选项
- 单击菜单选项后,单击时冻结悬停
- 如何创建 HTML 文本框,该文本框顶部有一个水平菜单选项卡可供选择
- 从下拉菜单选项中显示“标题”标签
- 如何从选择菜单选项动态声明全局变量
- 使用 Jquery 单击菜单链接时,激活或添加菜单选项卡上的类活动
- 如何在打开之前禁用菜单选项,使用jQuery Selectric
- Javascript 使用下拉菜单选项创建文本字段
- 在自己的网站上禁用chrome上下文菜单选项
- 选择选择菜单选项上的加载页面
- PHP / 如何使用提交按钮发布下拉菜单选项