HTML网站显示选项

Question

我是HTML编程的初学者,我有以下问题.我正在进行简单的试用.

我有以下选择菜单:

<p>Kies de frisdrank:</p>
<select id="frisdrank">
  <option value="Cola"> Cola </option>
  <option value="Fanta"> Fanta </option>
  <option value="spuitwater"> spuitwater </option>
  <option value="chocolademelk"> chocolademelk </option>
</select>

我也有一个按钮:

    <input id="OK" type="button" value="OK">

现在,我如何在某个地方显示文字或显示按下按钮时选择了哪个选项的标签？我知道这是非常基本的,但我仍然无法做到这一点.

**更新!!!**

谢谢大家的帮助!现在我想出了如何做到这一点.这是我的后续问题:我可以添加另一个匹配价格的文本字段吗？就像你选择Cola然后价格是例如20.如果你选择fanta,价格是25？

我想出了javascript.我已经对普通Java有一点经验了.

谢谢你的协助!

Answer 1

我建议你试试jQuery:

$("#OK").click(function() {
    $("#value").text($("#frisdrank").val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<p>Kies de frisdrank:</p>
<select id="frisdrank">
    <option value="Cola"> Cola </option>
    <option value="Fanta"> Fanta </option>
    <option value="spuitwater"> spuitwater </option>
    <option value="chocolademelk"> chocolademelk </option>
</select>
<input id="OK" type="button" value="OK">
    <span id="value"></span>