html点击d出下拉列表

跳转到相应的页面。html点击d出下拉列表选择后跳转到相应的页面。超文本标记语言，标准通用标记语言下的一个应用。HTML不是一种编程语言，而是一种标记语言，是网页制作所必备的。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。超文本标记语言（或超文本标签语言）的结构包括“头”部分、和“主体”部分，其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

html里可以用<select>标签设置下拉框。下面详细介绍其用法。

这是测试链接，可以参考本教程自己实 *** 网页链接。

1、<select>标签

<select>标签在HTML里面是下拉框，用户点一下可以选择里面的选项

2、<option>标签

<option>标签是<select>标签的选项，它有2个东西需要设置，分别是值value和文本显示。

例如这个opion

  <option value="0">请选择分类</option>

它的value是0，文本是"请选择分类"。

如果你在页面保存了一些信息，一般提交给服务器的时候提交的是它的value。

3、尝试编写例子

例如下面的代码，在html里面展示的效果如图

<select>

<option value="0">请选择分类</option>

<option value="1">美食/营养</option>

<option value="10">游戏/数码</option>

<option value="37">手工/爱好</option>

<option value="50">生活/家居</option>

<option value="73">健康/养生</option>

<option value="86">运动/户外</option>

<option value="93">职场/理财</option>

<option value="101">情感/交际</option>

<option value="108">母婴/教育</option>

<option value="123">时尚/美容</option>

</select>

<!--JS代码放入HEAD区域-->

<script type="text/javascript">

function dropdown_over(obj,msg,evt){

createTips(obj,msg,evt)

}

function dropdown_out(obj){

removeTips(obj)

}

function createTips(obj,msg,evt){

var p = GetMouse(evt)

var $tips = document.createElement("span")

$tips.id = "tips_" + obj.id

$tips.innerHTML = msg

$tips.style.position = "absolute"

$tips.style.left = p.x+"px"

$tips.style.top = (p.y+16)+"px"

$tips.style.zIndex = 1001

$tips.style.border = "1px solid #666"

$tips.style.backgroundColor = "#FE0"

$tips.style.color = "#000"

$tips.style.fontSize = "10pt"

$tips.style.padding = "3px"

document.body.appendChild($tips)

}

function removeTips(obj){

var $tips = document.getElementById("tips_" + obj.id)

if($tips != null)

document.body.removeChild($tips)

}

function GetMouse(evt){

evt = evt||window.event

return pointer = {

x:evt.pageX || (evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft)),

y:evt.pageY || (evt.clientY + (document.documentElement.scrollTop || document.body.scrollTop ))

}

}

</script>

<!--BODY中调用-->

<select id="dropdown" onmouseover="dropdown_over(this,'提示信息',event)" onmouseout="dropdown_out(this)">

<option>001</option>

<option>002</option>

<option>003</option>

<option>004</option>

<option>005</option>

</select>

---