【问题标题】:Javascript selected index onchange doesn't work at allJavascript选择的索引onchange根本不起作用
【发布时间】:2012-08-05 21:12:48
【问题描述】:

我正在尝试创建一个包含值的选择标记,如果选择了五个值中的两个,则屏幕上将显示另一个选择框。我试过搜索这个,发现人们在哪里使用 javascript 并使用 onchange 事件,但由于某种原因我无法让它工作。切换 id 是我想要显示的,如果选择了个人或短期,如果我不想隐藏它。代码如下,提前感谢您的帮助。我没有包含 javascript,因为我将其全部删除,但我尝试了几种不同的方法,但没有运气。我认为这是我布置表格的方式。

HTML

<tr>                        
   <td class='txt'><span>&#42;</span>Coverage Needed?</td>  
<td>
   <select name="ins_type" id='ins_options' onChange="toggle();">
     <option>Select...</option>                             
     <option value="Group">Group Insurance</option>
     <option value="Individual">Individual Insurance</option>
     <option value="Short Term">Short Term Insurance</option>                                   
     <option value="Medicare">Medicare</option>
     <option value="Life">Life Insurance</option>   
   </select>                
</td>                                   
<td ><div id='toggle'><span>&#42;</span>How Many?
   <select name='applicants' id='applicants' >                                      
      <option>Select...</option>
      <option value='1'>1</option>
      <option value='2'>2</option>
      <option value='3'>3</option>
      <option value='4'>4</option>
      <option value='5'>5</option>
      <option value='6'>6</option>
      <option value='7'>7</option>
      <option value='1'>8</option>
      <option value='9'>9</option>
      <option value='10'>10</option>    
   </select>
  </div>
  </td>             
</tr>

Javascript(我在想这样的东西应该可以)

<script type="text/javascript">
  function toggle() {
    if (document.getElementById("ins_options").options
    [getElementById("ins_options").selectedIndex].value == "Individual") {
       document.getElementById("toggle").style.display = "none";
    } else {
       document.getElementById("toggle").style.display = "block";
    }
  }
</script> 

【问题讨论】:

  • 即使您删除了 JavaScript,您仍然应该发布您尝试过的内容。
  • 表格非常好。请告诉我们您已经尝试过什么,这样我们就不会建议您已经考虑过的事情。
  • 感谢您的快速回复!我昨天正在处理它,并在我退出之前删除了它,以便我今天可以重新开始。我正在努力向您展示我使用的东西,以便您了解我的位置。我对javascript有点陌生,所以我不太了解它,但是一旦我看到它就可以理解它。

标签: javascript events select onchange


【解决方案1】:

您在所选索引查找中缺少 document - http://jsfiddle.net/VfEyW/

所以不是

[getElementById("ins_options").selectedIndex]

试试

[document.getElementById("ins_options").selectedIndex]

...

更新

要检查 2 个值,您可以这样做

  function toggle() {
    var val = document.getElementById("ins_options").options[document.getElementById("ins_options").selectedIndex].value;

    if ( val == "Individual" || val == "Short Term" ) {
       document.getElementById("toggle").style.display = "none";
    } else {
       document.getElementById("toggle").style.display = "block";
    }
  }

【讨论】:

  • 如何向 .value 标签添加两个值?如 .value == "个人" || “短期”)我知道这行不通,但我怎么能写这个?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-05-28
  • 1970-01-01
  • 1970-01-01
  • 2013-02-01
  • 2016-05-22
相关资源
最近更新 更多