如何使用onchange根据所选值显示不同的信息？

Question

我创建了一个包含书籍名称的下拉列表。从下拉列表中选择书名时，我希望它在同一页面中显示有关该书的信息。书信息存储在mysql数据库中。我目前能够显示所有书籍的信息，但我希望能够在php页面上对信息进行排序。

我试图实现here找到的答案，但没有任何反应。

<select id="selected" name="selection" onchange="getselected(this)">
<option value="default">Select</option>
<option value="book1">Book Name 1</option>
<option value="book2">Book Name 2</option>
<option value="book3">Book Name 3</option>
<option value="book4">Book Name 4</option>
</select>

我的脚本是：

<script>
function getselected(sel) {
var bookname = sel.value;  
}
</script>

首先，如何在页面上显示所选的书名？ 例如，如果从下拉列表中选择了书名1，则会出现一行显示书名1的文本。我尝试使用此脚本编写书名。

<script type="text/javascript">document.write(bookname);</script>

最终我想使用变量bookname来选择mysql数据库的信息。有多个条目具有相同的书名。 SELECT * WHERE name = $ bookname

Answer 1

将以下HTML添加到您的页面

<div id="dynamic"></div>

将您的脚本更改为以下

<script>
function getselected(sel) { 
document.getElementById("dynamic").innerHTML = sel.options[sel.selectedIndex].text; 
}
</script>

希望这有帮助！