Javascript 如何显示div取决于用户使用js从select option表单中选择什么？

我想显示一个不同的div，这取决于用户从主htmlphp选择选项表单中选择的内容。表格如下：

    <form action="" method="POST">
                      <select name="pages">
                        <option value="home">home page</option>
                        <option value="blogs">blogs page</option>
                        <option value="aboutus">aboutus page</option>
                      </select></br>
                    </form>

    <div>
...
    </div>

主页
博客页面
关于页面


...

---

例如，如果用户单击“主页”，页面将自动重定向（不刷新）并在表单下显示主页的div&如果用户单击“博客”，主页div将消失，博客div将出现！我不知道如何使用js实现这一点，但如果你知道如何实现，请给我一些提示。谢谢

下面是一个使用jquery的简单示例：

$('#select-pages').on('change', function() {
    $('#my-div').html(this.value);

})

---

这方面有很多不同的实现方式。我建议使用一个javascript框架，比如angular。“重定向”不能不刷新。如果您想在不刷新的情况下实现它，我建议您查找XMLHttpRequest。但是，这不是交叉浏览器，所以您可以直接使用。在选择下，您可以创建

并将内容加载到其中。但是，它需要在服务器上进行一些工作。看来你没有足够的知识来做这件事。