2013-12-16 61 views
1

我试图做到这一点,当从我的下拉菜单中进行选择时,文本将相应地显示在我的textarea中,现在我一直试图让其中一个人工作。onchange不能用于下拉菜单?

问题:它不会显示textarea内数组的字符串。这个代码中的问题是什么?

下拉菜单:

<select id="dropdown" onchange="getFrames();"> 
    <option value="1" selected="selected"> Blank </option> 
    <option value="2"> Exercise </option> 
    <option value="3"> Juggler </option> 
    <option value="4"> Bike </option> 
    <option value="5"> Dive </option> 
</select> 

textarea的:

<textarea id="textstage" rows="80" cols="20"> </textarea> 

的JavaScript:

我有这些全局变量。

var theStage = document.getElementById("textstage"); 
var getDrop = document.getElementById("dropdown"); 

然后我有这个功能。

function getFrames(){ 
    var dropSel = getDrop.options[getDrop.selectedIndex].value; 

    if(dropSel === 2){ 
     theStage.value = ANIMATIONS["Exercise"]; 
} 

被引用的数组是来自另一个js文件的全局数组。

+0

控件进入getFrames方法吗?我的意思是,你是否尝试在该方法中使用警报,并检查事件是否被触发? –

+0

嗯,让我试试。 – Corjava

+0

当我在if(dropSel === 2){}的同一节中实现警报时{当我在下拉菜单中更改所选选项以进行练习时,没有警报发生。 – Corjava

回答

3

尝试:

var theStage,getDrop; 

function getFrames() { 
    var dropSel = getDrop.options[getDrop.selectedIndex].innerHTML;//+getDrop.value; 
    theStage.value = ANIMATIONS[dropSel]; 

} 

//Place the selection part on load callback 
window.onload = function() { 
    theStage = document.getElementById("textstage"); 
    getDrop = document.getElementById("dropdown"); 
} 

Demo

  • 你可以只用getDrop.value而不是做getDrop.options[getDrop.selectedIndex].value
  • ===是严格的平等比较意义“2”=== 2将是错误的,因为在你的情况。
  • 似乎你正在寻找选项文本来查找基于这个值作为你的对象动画中的键值。所以,你可以做getDrop.options[getDrop.selectedIndex].innerHTML
  • 您的文档选择的代码应该是里面的window.onload或
0

我省略了内联事件处理程序作出你的HTML一个小的改动的HTML元素后,反而增加它的JavaScript。

HTML:

<select id="dropdown"> 
    <option value="1" selected="selected"> Blank </option> 
    <option value="2"> Exercise </option> 
    <option value="3"> Juggler </option> 
    <option value="4"> Bike </option> 
    <option value="5"> Dive </option> 
</select> 
<textarea id="textstage" rows="80" cols="20"> </textarea> 

此外,在JavaScript中,我拿走了全等(===)和由它只是(= =)。

的javascript:

var theStage = document.getElementById("textstage"); 
var getDrop = document.getElementById("dropdown"); 
getDrop.addEventListener("change",getFrames); 
function getFrames(){ 
    var dropSel = getDrop.options[getDrop.selectedIndex].value; 
    if(dropSel == 2){ 
     theStage.value = ANIMATIONS["Exercise"]; 
    } 
} 

希望它现在应该为你工作。