Javascript下拉菜单计算

我对我的代码有点问题。我正在尝试从下拉菜单中进行计算，然后它会将其更改为文本框。我已经花了好几天的时间试图找出它，并使用谷歌搜索的方式来编写函数。任何人都可以请帮助或给我如何解决这个问题的建议？Javascript下拉菜单计算

function numGuest() 
{ 
    var a = document.getElementById("guests"); 
    if(a.options[a.selectedIndex].value == "0") 
    { 
     registration.banq.value = "0"; 
    } 
    else if(a.options[a.selectedIndex].value == "1") 
    { 
     registration.banq.value = "30"; 
    } 
}

<select id="guests" name="guests"> 
<option value="0">0</option> 
<option value="1">1</option> 
<option>2</option> 
<option>3</option> 
<option>4</option> 
<option>5</option> 
</select> 

<input type="text" id="banq" name="banq" onChange="numGuest()" disabled />

来源

2012-10-03 ai5uzu

什么是'注册'？什么是'banq'？当文本输入的值发生变化时，或者当下拉列表的值发生变化时，是否要运行'numGuest'函数？ –

注册是表单ID和名称，banq是文本框/输入ID和名称。当我从下拉菜单中选择选项时，我想让该功能运行。 – ai5uzu

<html> 
<script> 
function numGuest() 
{ 
    var banq = document.getElementById('banq'); 
    var a = document.getElementById("guests"); 

    if(a.options[a.selectedIndex].value == "0") 
    { 
     banq.value = "0"; 
    } 
    else if(a.options[a.selectedIndex].value == "1") 
    { 
     banq.value = "1"; 
    } 
} 
</script> 
<select id="guests" name="guests" onChange="numGuest()" > 
    <option value="0">0</option> 
    <option value="1">1</option> 
    <option>2</option> 
    <option>3</option> 
    <option>4</option> 
    <option>5</option> 
</select> 

    <input type="text" id="banq" name="banq" disabled /> 
</html>

来源

2012-10-03 02:59:49 EL45

期望元素ID和名称是全局变量是不好的做法，它是来自早期网络的IE功能，被其他浏览器复制以实现兼容性，应该被废弃。 – RobG

非常感谢！我没有意识到我把onchange放在了input上而不是select标签上。谢谢你确认一些代码是正确的。有太多不同的方式来编码，我很困惑。 – ai5uzu

为什么是id = BANQ（文本框）禁用？

启用： document.getElementById（'banq'）。disabled = false;

对于选择的值：未定义

function numGuest(){ 
    var theGuestValForCalc = 0; 
    var theFinalResult = 0; 

    theGuestValForCalc = document.getElementById('guests').options[document.getElementById('guests').selectedIndex].value; 



    theFinalResult = theGuestValForCalc * 10 // or some value, calculation, etc. 

    document.getElementById('banq').innerHTML = theFinalResult; 

    // return theFinalResult;

}

来源

2012-10-03 02:57:23

由于OP要显示所选选项的值，所以它被禁用。不知道为什么，因为选项是可见的和禁用的元素不成功。也许OP需要[readonly]（http://dev.w3.org/html5/spec/single-page.html#the-readonly-attribute）字段。 – RobG

在您的代码：

> <input type="text" id="banq" name="banq" onChange="numGuest()" disabled />

这也许应该是一个readonl Y场，没有被禁用。

onchange监听器应该位于select元素上。然后在numGuest功能

<select name="guests" onchange="numGuest(this)">

：此外，还可以在听者传递到元素的引用为了方便

function numGuest(element) {

和元素将是其处理程序调用元素的引用功能。

既然你说你的控件的形式，并与名称表单控件是由一个名为它们在形式的特性，可以简化您的代码：

var form = element.form; 
    var banq = form.banq; 
    var a = form.guests; // or element

如果所选选项的值（见下面的注释），那么你可以直接使用select元素的value属性：

if (a.value == "0") { 
    banq.value = "0"; 

    } else if (a.value == "1") { 
    banq.value = "1"; 
    }

你就完成了。

注：

如果选不具有价值属性或特性，它的值是文本内容。不幸的是旧版本的IE不支持，所以你必须使用select.options[select.selectedIndex].text。但最好的想法是总是给选项一个值，这样你才能得到select元素的值。
没有必要给表单控件名称和ID。他们必须有名字才能成功，所以只要给他们名字并忘记身份证。

来源

2012-10-03 03:35:40 RobG

Javascript下拉菜单计算

回答

相关问题