Question

我有选择列表，我想在下拉列表中显示缩写选项但显示下面的全文。我正在尝试修改我之前用过的javascript，以便在选择“其他”作为选项时显示文本输入。 select，div和javascript是在php中动态生成的。我已经将php生成的代码剪切并粘贴到一个普通的html文件中，以确保它真的是这个代码的问题。

我有以下脚本：

     <script type="text/javascript">  
                function showreason() { if (document.getElementById('showreason').value == 'BLANK') { 
document.getElementById('showreasonBLANK').style.display = 'block' ;
} else {
        document.getElementById('showreasonBLANK').style.display = 'none';
    } if (document.getElementById('showreason').value == 'RECAP') { 
document.getElementById('showreasonRECAP').style.display = 'block' ;
} else {
        document.getElementById('showreasonRECAP').style.display = 'none';
    } if (document.getElementById('showreason').value == 'RETIRE') { 
document.getElementById('showreasonRETIRE').style.display = 'block' ;
} else {
        document.getElementById('showreasonRETIRE').style.display = 'none';
    } if (document.getElementById('showreason').value == 'ALTERN') { 
document.getElementById('showreasonALTERN').style.display = 'block' ;
} else {
        document.getElementById('showreasonALTERN').style.display = 'none';
    } if (document.getElementById('showreason').value == 'EXPAND') { 
document.getElementById('showreasonEXPAND').style.display = 'block' ;
} else {
        document.getElementById('showreasonEXPAND').style.display = 'none';
    }} 
function selection(select) {
    document.getElementById("section_" + select.value).style.display = "block";
}
            </script>

这是在身体里：

    <SELECT NAME="showreason"  id="reason_select"  onchange="showreason()" >
<OPTION  VALUE="BLANK"> Omit Reason </OPTION>
<OPTION  VALUE="RECAP"> Recapitalization </OPTION>
<OPTION  VALUE="RETIRE"> Retirement </OPTION>
<OPTION  VALUE="ALTERN"> So owners can pursue other alternatives </OPTION>
<OPTION  VALUE="EXPAND"> To allow the business to grow </OPTION></select>
</p>
<div id="showreasonBLANK" style="display: none;"></div>
<div id="showreasonRECAP" style="display: none;">A recapitalization will allow current ownership to diversify holdings without compromising the company's flexibility to finance growth.</div>
<div id="showreasonRETIRE" style="display: none;">The business is being sold for retirement.</div>
<div id="showreasonALTERN" style="display: none;">While this business is attractive the current ownership is looking to concentrate on other business opportunities.</div>
<div id="showreasonEXPAND" style="display: none;">Current ownership believes that a new owner will be able to grow the business faster and take it to a new level.</div>

我是javascript的新手，所以我尝试了一些看起来没什么区别的东西。我使用onclick而不是onshow并使用单引号而不是showreason（）周围的双打。

无论我从列表中选择哪个选项，都没有显示任何div的文本，我看不清楚原因。有人可以帮忙吗？

Answer 1

而不是

document.getElementById('showreason')

在你的条件下你应该使用

document.getElementById('reason_select')

因为SELECT元素的id是“reason_select”而不是“showreason”

使用javascript根据选择列表中的选项显示div

1 个答案: