您的位置:内蒙古11选五开奖5号的 > HTML > 正文

十一选五兑奖规则:Html form <select>下拉列表菜单 跳转菜单

Html form select下拉列表菜单与select跳转菜单表单标签案例教程

select目录
  1. Form select语法与结构
  2. Form select标签使用认识
  3. select普通菜单与跳转菜单案例
  4. DW软件里截图表单效果
  5. select表单标签案例图
  6. html form select案例总结

一、Form select语法与结构:

<select name="">
<option value="0">thinkcss</option>
<option value="1">thinkcss</option>
</select> 

二、Form select标签使用说明:

为什么我们要使用Form select下来菜单列表呢?那是我们用于表单下拉选择所需项。

下面内蒙古11选五开奖5号的技术thinkcss为大家介绍常见html Form select使用地方。

我们使用表单下拉列表选择数据,如省、市、县、年、月等数据,我们即可使用下拉菜单表单进行设置。
select 我下拉列表菜单标签
Option为下拉列表数据标签
Value 为Option的数据值(用于数据的传值)

form select下拉菜单列表使用地方展示
select使用地方,上图为日期下拉列表案例运用截图

三、Form select使用种类:

Select下拉菜单列表表单标签,常使用有两种

1)、普通下拉列表菜单
html代码如下:

<form action="" method="get"> 
<label>1、普通下拉列表菜单</label>
<select name="">
<option value="0">thinkcss</option>
<option value="1">thinkcss</option>
</select>
</form>

2)、跳转下拉列表菜单(如常见点击后跳转到选择网站)
常常一些网站做友情链接,与部门之间使用select下拉标签实现网址跳转。下面我们通过代码与案例接受select跳转菜单应用。

跳转菜单html代码如下:

<form action="" method="get"> 
<label>2、跳转的下拉列表菜单</label>
<select name="jumpMenu" id="jumpMenu" onchange="MM_jumpMenu('parent',this,0)">
<option value="//www.phlmy.com/">thinkcss</option>
<option value="//www.phlmy.com/">thinkcss</option>
</select>
</form>

实现跳转还需要在head标签内加入Js脚本动作代码:

<script type="text/javascript"> 
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
//-->
</script>

即可使用表单select控件实现跳转的列表菜单效果。

3)、更简洁的新建浏览器(选项卡)窗口跳转菜单:
只需<select>标签内加入如下代码:

onchange="javascript:if (this.options[this.selectedIndex].value != '')
 window.open(this.options[this.selectedIndex].value);this.options[0].selected;"

得到以下代码:

<select onchange="javascript:if (this.options[this.selectedIndex].value != '')
window.open(this.options[this.selectedIndex].value);this.options[0].selected;">

完整简单新打开网页窗口跳转菜单实例:

<form action="" method="get">  
<label>新建浏览器网页窗口下拉跳转菜单</label>
<select name=""onchange="javascript:if (this.options[this.selectedIndex].value != '')
window.open(this.options[this.selectedIndex].value);this.options[0].selected;">
<option value="0">thinkcss</option>
<option value="1">thinkcss</option>
</select>
</form>

四、DW软件里截图表单效果:

select下拉菜单列表与跳转下拉菜单案例截图
html select下拉菜单列表与跳转菜单案例截图

五、此select表单标签案例在浏览器中效果:

form select案例截图
实例案例截图

完整案例在线演示//www.phlmy.com/fanli/form-select.html
完整案例下载地址

六、thinkcss对html form select案例总结说明:

1)、form select常常我们使用此表单控件设置网页下拉列表菜单
2)、当我们选择“2、跳转的下拉菜单列表”下拉数据后,将会跳转到对于指定设置URL网站。使用select表单下拉菜单实现跳转网站网址非常实用或方便,同时记得加上JS代码。
3)、html form、form input、html input、input type、form表单

学习内蒙古11选五开奖5号的欢迎来thinkcss!

 

相关标签: 下拉菜单 select 跳转菜单
如需转载,请注明文章出处和来源网址:www.thinkcss.com/html/336.shtml

日期:2001-01-08 12:03:29 来源:内蒙古11选五开奖5号的 www.phlmy.com 作者:ThinkCSS
  • 其实啊也不奇怪,菜做好了先来一份尝尝味道于是提前开吃了。 2019-08-19
  • 十九大精神进机关:原原本本吃透精神 学懂弄通昂扬斗志 2019-08-13
  • 我们是建立市场经济,公有制如何建立市场经济,就要明晰产权,不明晰产权如何建立市场经济? 2019-08-13
  • 2017巴塞尔国际钟表珠宝展 2019-08-11
  • 政务舆情回应如何把握语言分寸感? 2019-08-11
  • 候选案例:机井通电惠民生 2019-08-08
  • 2018年04期 中国国家地理网 2019-08-05
  • 解析视频播控平台黑产链 20元看12家网站VIP会员视频 2019-07-31
  • 西安外国语大学第二十四届校园文化艺术节闭幕式暨第一届朗读者圆满落幕西安外国语大学第二十四届校园文化艺术节-陕西教育新闻 2019-07-31
  • 俄罗斯世界杯今日开战,送上最全观赛指南!你最看好哪支球队? 2019-07-29
  • 《人民日报》让我爱上了文学(原创首发) 2019-07-29
  • 【北京页川车型报价】北京页川4S店车型价格 2019-07-27
  • 河北沧州经济开发区管理委员会 2019-07-24
  • 强村带弱村结对共发展 2019-07-24
  • 《读药》151期:短篇小说——解读蒋一谈《庐山隐士》 2019-07-15
  • 舟山飞鱼基本走势图 大星双色球走势图 11选5杀2个100%技巧 澳门小神仙彩图2016 广西11选5电视走势图 快乐十分前三直高人 3d二胆六拖复式 体彩任选9场比分直播 pk10牛牛技巧 湖北十一选五彩票通 排列5预测的最好专家 江苏十一选五中奖计算 彩票销售培训主持词 澳洲幸运10冠军走势图 内部一波中特