HTML基础练习|下拉菜单

Urf_read

于 2024-10-05 20:06:08 发布

阅读量201

点赞数 2

文章标签： html 前端 javascript

本文链接：https://blog.youkuaiyun.com/m0_69886881/article/details/142718341

版权

html 专栏收录该内容

28 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <h1>水果选择器</h1>
  <label for="favorites">选择你最爱吃的水果</label>
  <select id="favorites" name="favorites">
    <option value="apple">苹果</option>
    <option value="banana">香蕉</option>
    <option value="orange">橘子</option>
    <option value="grape">葡萄</option>
  </select>
  <br>
  <button onclick="console.error(111)">提交</button>
  <script>
    function submitSelection() {
      let selectedFruit = document.getElementById('favorites').value;
      alert('你选择的水果是：' + selectedFruit);
    }
  </script>
</body>
</html>