html下拉列表跳转页面
时间: 2023-09-26 08:06:11 浏览: 56
HTML下拉列表跳转页面的实现方法有多种。其中一种常见的方法是使用JavaScript来实现。
你可以使用以下代码实现这个功能:
```html
<select id="websiteSelect">
<option value="">请选择网站</option>
<option value="https://www.google.com">Google</option>
<option value="https://www.baidu.com">百度</option>
<option value="https://www.yahoo.com">Yahoo</option>
</select>
<input type="text" id="urlText" readonly>
<button onclick="goToWebsite()">确认跳转</button>
<script>
function goToWebsite() {
var select = document.getElementById("websiteSelect");
var urlInput = document.getElementById("urlText");
var selectedOption = select.options[select.selectedIndex];
var url = selectedOption.value;
urlInput.value = url;
if (url) {
window.location.href = url;
}
}
</script>
```
这段代码创建了一个下拉列表框和一个文本框,还有一个按钮。当选择了某个网站后,对应的网址会显示在文本框中。点击确认跳转按钮后,会根据文本框中的网址进行页面跳转。