Jquery 如何在单击时从下拉列表中显示基于div的值？

我试图根据用户单击“go”按钮时选择的值显示一些不同的div。这是我的剧本：

$(document).ready(function(){
$('#divarea1').hide();
$('#divarea2').hide();
$('#divarea3').hide();

    $('#go-button').click(function() {
     var whatToShow = $('#dropdown').val();
        if (whatToShow = ref1) {
            $('#divarea1').show();
            }
        else if (whatToShow = ref2) {
            $('#divarea2').show();
            }
        else {
            $('#divarea3').show();
            }
});
});

这是我的html：

<form name="ref-selector" method="POST" ACTION="URL">
    <select id="dropdown" name="dropdown"> 
        <option value="ref1">Book</option>
        <option value="ref2">Journal</option>
        <option value="ref3">Webpage</option>
    </select>
    <input type="button" id="go-button" value="Go">
</form>


<div id="divarea1">
<p>Some random content</p>
</div>

<div id="divarea2">
<p>Some other random content</p>
</div>

<div id="divarea3">
<p>The last random content</p>
</div>

书
杂志
网页
一些随机内容

其他一些随机内容

最后的随机内容

---

我希望你们中的一些人能帮助我。我试着四处寻找解决方案，但似乎没有什么是我想要的，而且我无法从我读到的其他内容中找到解决方案。

我建议您将

的ID作为选项的值。这将阻止您使用

，否则将使用

试试这个：

<form name="ref-selector" method="POST" ACTION="URL">
    <select id="dropdown" name="dropdown"> 
        <option value="ref1">Book</option>
        <option value="ref2">Journal</option>
        <option value="ref3">Webpage</option>
    </select>
    <input type="button" id="go-button" value="Go">
</form>


<div id="divarea-ref1">
<p>Some random content</p>
</div>

<div id="divarea-ref2">
<p>Some other random content</p>
</div>

<div id="divarea-ref3">
<p>The last random content</p>
</div>

我建议您将
的ID作为选项的值。这将阻止您使用
，否则将使用

试试这个：

<form name="ref-selector" method="POST" ACTION="URL">
    <select id="dropdown" name="dropdown"> 
        <option value="ref1">Book</option>
        <option value="ref2">Journal</option>
        <option value="ref3">Webpage</option>
    </select>
    <input type="button" id="go-button" value="Go">
</form>


<div id="divarea-ref1">
<p>Some random content</p>
</div>

<div id="divarea-ref2">
<p>Some other random content</p>
</div>

<div id="divarea-ref3">
<p>The last random content</p>
</div>

谢谢你，穆尼姆。它工作得很好！我对jQuery还是很陌生，所以我不知道我可以用那种方式来做。谢谢你，穆尼姆。它工作得很好！我对jQuery还是很陌生，所以不知道我可以用那种方式来做。