• 谁是女排最大核心?国际排联给出答案 她当选不意外 2020-02-09
  • 新疆优秀出版物上网工程 2020-02-08
  • 智媒云图(Intell Vision):植物识别 2020-01-25
  • 【玛沁天气】最新玛沁今天天气,实时提供玛沁气温、空气质量、24小时天气预报、生活指数查询 2020-01-25
  • 月薪过万白领辞职回乡养鸡 亏数十万后回城找工作 2020-01-20
  • 拉美国家新闻官员与记者宁夏考察采访活动结束 2020-01-06
  • 荆楚网互联网出版机构 2020-01-06
  • 北京限价房项目开闸 百亿货值将入市 ——凤凰网房产北京 2019-12-08
  • 秘鲁侨界研讨两岸关系和平发展 2019-12-02
  • 西安紫云溪小区深夜有人竟高空扔粪便 律师:违法行为 2019-11-29
  • 罗品禧的专栏作者中国国家地理网 2019-11-29
  • 市委把全国两会精神原汁原味传达到基层 2019-11-28
  • 西南铁路端午假期发送400余万人次 两人不文明乘车或受失信惩戒 2019-11-20
  • 四件汉白玉螭头回归圆明园 2019-11-20
  • 人的本质的演变规律:从原始母系氏族社会的公有者经过父系氏族社会私有和公有双重所有者而演变为私有制阶级社会的私有者,然后经过现代社会公有和私有双重所有者... 2019-11-06
  • 欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
    您的位置:香港买马资料大全 > HTML >

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

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

    一、Form select语法与结构:   -   TOP

    1. <select name=""> 
    2. <option value="0">DIVCSS5</option> 
    3. <option value="1">DIVCSS5</option> 
    4. </select> 

    二、Form select标签使用说明:   -   TOP

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

    下面香港买马资料大全技术DIVCSS5为大家介绍常见html Form select使用地方。

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

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

    三、Form select使用种类:   -   TOP

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

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

    1. <form action="" method="get"> 
    2. <label>1、普通下拉列表菜单</label> 
    3. <select name=""> 
    4. <option value="0">DIVCSS5</option> 
    5. <option value="1">DIVCSS5</option> 
    6. </select> 
    7. </form> 

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

    跳转菜单html代码如下:

    1. <form action="" method="get"> 
    2. <label>2、跳转的下拉列表菜单</label> 
    3. <select name="jumpMenu" id="jumpMenu"
       onchange="MM_jumpMenu('parent',this,0)"> 
    4. <option value="//www.ziixf.tw/">DIVCSS5</option> 
    5. <option value="//www.ziixf.tw/">DIVCSS5</option> 
    6. </select> 
    7. </form> 

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

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

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

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

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

    得到以下代码:

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

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

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

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

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

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

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

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

    六、DIVCSS5对html form select案例总结说明:   -   TOP

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

    学习香港买马资料大全欢迎来DIVCSS5!

    如需转载,请注明文章出处和来源网址://www.ziixf.tw/html/h336.shtml

    香港买马资料大全 www.ziixf.tw 如对文章有任何疑问请提交到DIV CSS论坛,或有任何网页制作CSS问题立即到CSS论坛发贴求解 或 直接DIVCSS5网页顶部搜索遇到DIVCSS疑问。
    香港买马资料大全文章修订日期:2018-08-14 17:37 原创:香港买马资料大全
    本文香港买马资料大全 www.ziixf.tw DIVCSS5版权所有。

  • 谁是女排最大核心?国际排联给出答案 她当选不意外 2020-02-09
  • 新疆优秀出版物上网工程 2020-02-08
  • 智媒云图(Intell Vision):植物识别 2020-01-25
  • 【玛沁天气】最新玛沁今天天气,实时提供玛沁气温、空气质量、24小时天气预报、生活指数查询 2020-01-25
  • 月薪过万白领辞职回乡养鸡 亏数十万后回城找工作 2020-01-20
  • 拉美国家新闻官员与记者宁夏考察采访活动结束 2020-01-06
  • 荆楚网互联网出版机构 2020-01-06
  • 北京限价房项目开闸 百亿货值将入市 ——凤凰网房产北京 2019-12-08
  • 秘鲁侨界研讨两岸关系和平发展 2019-12-02
  • 西安紫云溪小区深夜有人竟高空扔粪便 律师:违法行为 2019-11-29
  • 罗品禧的专栏作者中国国家地理网 2019-11-29
  • 市委把全国两会精神原汁原味传达到基层 2019-11-28
  • 西南铁路端午假期发送400余万人次 两人不文明乘车或受失信惩戒 2019-11-20
  • 四件汉白玉螭头回归圆明园 2019-11-20
  • 人的本质的演变规律:从原始母系氏族社会的公有者经过父系氏族社会私有和公有双重所有者而演变为私有制阶级社会的私有者,然后经过现代社会公有和私有双重所有者... 2019-11-06
  • 大富豪棋牌手机版官网 台湾棒球比分 竞彩篮球大小分 阳光彩票安卓 北京快3近200走势图 25选7玩法 kk棋牌官方网站 五分彩彩票怎么扫雷最准 乒乓球友谊赛将举行 比分网即时比分