Html form <select>下拉列表菜單與跳轉菜單表單標簽篇
Html form select下拉列表菜單與select跳轉菜單表單標簽案例教程select目錄 Form select語法與結構 Form select標簽使用認識 select普通菜單與跳轉菜單案例 DW軟件里截圖表單效果 select表單標簽案例圖 html form select案例總結一、Form select語法與結構: - TOP<selectname=""><optionvalue="0">DIVCSS5</option><optionvalue="1">DIVCSS5</option></select>二、Form select標簽使用說明: - TOP為什么我們要使用Form select下來菜單列表呢?那是我們用于表單下拉選擇所需項。下面CSS技術DIVCSS5為大家介紹常見html Form select使用地方。我們使用表單下拉列表選擇數據,如省、市、縣、年、月等數據,我們即可使用下拉菜單表單進行設置。select 我下拉列表菜單標簽Option為下拉列表數據標簽Value 為Option的數據值(用于數據的傳值)select使用地方,上圖為日期下拉列表案例運用截圖三、Form select使用種類: - TOPSelect下拉菜單列表表單標簽,常使用有兩種:1)、普通下拉列表菜單html代碼如下:<formaction=""method="get"><label>1、普通下拉列表菜單</label><selectname=""><optionvalue="0">DIVCSS5</option><optionvalue="1">DIVCSS5</option></select></form>2)、跳轉下拉列表菜單(如常見點擊后跳轉到選擇網站)常常一些網站做友情鏈接,與部門之間使用select下拉標簽實現網址跳轉。下面我們通過代碼與案例接受select跳轉菜單應用。跳轉菜單html代碼如下:<formaction=""method="get"><label>2、跳轉的下拉列表菜單</label><selectname="jumpMenu"id="jumpMenu"onchange="MM_jumpMenu('parent',this,0)"><optionvalue="http://www.DIVCSS5.com/">DIVCSS5</option><optionvalue="http://www.divcss5.com/">DIVCSS5</option></select></form>實現跳轉還需要在head標簽內加入Js腳本動作代碼:<scripttype="text/javascript"><!--functionMM_jumpMenu(targ,selObj,restore){//v3.0eval(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;"得到以下代碼:<selectonchange="javascript:if(this.options[this.selectedIndex].value!='')window.open(this.options[this.selectedIndex].value);this.options[0].selected;">完整簡單新打開網頁窗口跳轉菜單實例:<formaction=""method="get"><label>新建瀏覽器網頁窗口下拉跳轉菜單</label><selectname=""onchange="javascript:if (this.options[this.selectedIndex].value != '') window.open(this.options[this.selectedIndex].value);this.options[0].selected;"><optionvalue="0">DIVCSS5</option><optionvalue="1">DIVCSS5</option></select></form>四、DW軟件里截圖表單效果: - TOPhtmlselect下拉菜單列表與跳轉菜單案例截圖五、此select表單標簽案例在瀏覽器中效果: - TOP實例案例截圖完整案例在線演示:http://www.divcss5.com/fanli/form-select.html完整案例下載地址:立即下載(1.502KB)六、DIVCSS5對html form select案例總結說明: - TOP1)、form select常常我們使用此表單控件設置網頁下拉列表菜單2)、當我們選擇“2、跳轉的下拉菜單列表”下拉數據后,將會跳轉到對于指定設置URL網站。使用select表單下拉菜單實現跳轉網站網址非常實用或方便,同時記得加上JS代碼。3)、html form、form input、html input、input type、form表單學習DIV+CSS歡迎來DIVCSS5!DIVCSS5為您推薦的相關聯教程css實現下拉表單select美化jq css實現下拉列表美化
上一篇: HTML <u>下劃線標簽元素        下一篇: HTML <EM>強調標簽元素

標簽:  嘉興網站建設 嘉興企業建站 嘉興網站優化