使用单选按钮显示/隐藏JavaScript(隐藏不起作用)

时间:2016-07-13 15:13:20

标签: javascript radio-button show-hide

我对JavaScript没有经验,所以如果这看起来很简单,我会道歉。我有一个带有4个单选按钮的表单,每个选项都有其他相应的字段。加载表单时,附加字段将被隐藏,并且只应在选择了正确的单选按钮时显示。我能够正确显示字段,但是,当选择了不同的单选按钮时,无法让它们隐藏。我查看了类似问题的其他帖子,但找不到任何有效的方法。任何帮助将不胜感激!

XSL代码:

<input type="radio" name=rdoRequestType" id="mvrRequest" value='MVR"
   onclick="saveRadioButton('MVR', 'abcRequestType');showOptions();">
   <xsl:if test="$RequestType = 'MVR'">
       <xsl:attribute name="checked">true</xsl:attribute>
   </xsl:if>
</input>

<input type="radio" name=rdoRequestType" id="mocRequest" value='MOC"
   onclick="saveRadioButton('MOC', 'abcRequestType');showOptions();">
   <xsl:if test="$RequestType = 'MOC'">
       <xsl:attribute name="checked">true</xsl:attribute>
   </xsl:if>
</input>

<input type="radio" name=rdoRequestType" id="mtcRequest" value='MTC"
   onclick="saveRadioButton('MTC', 'abcRequestType');showOptions();">
   <xsl:if test="$RequestType = 'MTC'">
       <xsl:attribute name="checked">true</xsl:attribute>
   </xsl:if>
</input>

<input type="radio" name=rdoRequestType" id="ltuRequest" value='LTU"
   onclick="saveRadioButton('LTU', 'abcRequestType');showOptions();">
   <xsl:if test="$RequestType = 'LTU'">
       <xsl:attribute name="checked">true</xsl:attribute>
   </xsl:if>
</input>

<div id='MVR' style="display:none">
   <p>Additional text 1</p>
</div>

<div id='MOC' style="display:none">
   <p>Additional text 2</p>
</div>

<div id='MTC' style="display:none">
   <p>Additional text 3</p>
</div>

<div id='LTU' style="display:none">
   <p>Additional text 4</p>
</div>

我将以下内容作为外部JavaScript文件:

function showOptions()
{
  if (document.getElementById('mvrRequest').checked)
  {
  document.getElementById('MVR').style.display = 'block';
  document.getElementById('MOC').style.display = "none";
  document.getElementById('MTC').style.display = "none";
  document.getElementById('LTU').style.display = "none";    
  }
  else if (document.getElementById('mocRequest').checked)
  {
  document.getElementById('MOC').style.display = 'block';
  document.getElementById('MVR').style.display = "none";
  document.getElementById('MTC').style.display = "none";
  document.getElementById('LTU').style.display = "none";        
  }
  else if (document.getElementById('mtcRequest').checked)
  {
  document.getElementById('MTC').style.display = 'block';   
  document.getElementById('MVR').style.display = "none";
  document.getElementById('MOC').style.display = "none";
  document.getElementById('LTU').style.display = "none";        
  }
  else if (document.getElementById('ltuRequest').checked)
  {
  document.getElementById('LTU').style.display = 'block';
  document.getElementById('MVR').style.display = "none";
  document.getElementById('MOC').style.display = "none";
  document.getElementById('MTC').style.display = "none";        
  }

}

0 个答案:

没有答案