JavaScript實現(xiàn)通過select標(biāo)簽跳轉(zhuǎn)網(wǎng)頁的方法
本文實例講述了JavaScript實現(xiàn)通過select標(biāo)簽跳轉(zhuǎn)網(wǎng)頁的方法。分享給大家供大家參考,具體如下:
我們經(jīng)常有遇到需要用select標(biāo)簽跳轉(zhuǎn)到新網(wǎng)頁的情況,dw生成的代碼太復(fù)雜,那么有沒有精簡的代碼得以實現(xiàn)呢?經(jīng)過仔細的研究找到了以下幾段代碼,非常不錯。
話不多說,直奔主題。
當(dāng)面跳轉(zhuǎn)的核心代碼是:"location.href=value"
新頁面打開的核心代碼是:"window.open()"
代碼分四類:
1、當(dāng)前頁面直接跳轉(zhuǎn):
<select name="" onchange="javascript:location.href=this.value;"> <option value="http://www.dbjr.com.cn" selected="selected" >jb51</option> <option value="http://www.163.com" >163</option> <option value="http://www.sina.com" >sina</option> <option value="http://www.sohu.com" >sohu</option> </select>
2、新頁面彈出跳轉(zhuǎn):
<select name="" onchange="javascript:window.open(this.options[this.selectedIndex].value)"> <option value="http://www.dbjr.com.cn" selected="selected" >jb51</option> <option value="http://www.163.com" >163</option> <option value="http://www.sina.com" >sina</option> <option value="http://www.sohu.com" >sohu</option> </select>
3、當(dāng)前頁面點擊按鈕跳轉(zhuǎn):
<form name="frm2" action=""> <select name="page2"> <option value="http://www.dbjr.com.cn" selected="selected" >jb51</option> <option value="http://www.163.com" >163</option> <option value="http://www.sina.com" >sina</option> <option value="http://www.sohu.com" >sohu</option> </select> <input type="button" value="提交" onclick="javascript:location.href=document.frm2.page2.options[document.frm2.page2.selectedIndex].value;"/> </form>
4、新頁面點擊按鈕跳轉(zhuǎn):
<form name="frm" action=""> <select name="page"> <option value="http://www.dbjr.com.cn" selected="selected" >jb51</option> <option value="http://www.163.com" >163</option> <option value="http://www.sina.com" >sina</option> <option value="http://www.sohu.com" >sohu</option> </select> <input type="button" value="提交" onclick="javascript:window.open(document.frm.page.options[document.frm.page.selectedIndex].value)"/> </form>
以上是四種常見的跳轉(zhuǎn)方法。
另外還有一種當(dāng)前頁面跳轉(zhuǎn)的代碼也比較簡潔:
<select name="" onchange="self.location.href=options[selectedIndex].value" > <option value="http://www.baidu.com">百度</option> <option value="http://www.163.com">網(wǎng)易</option> </select>
這個也是非常好的。
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript窗口操作與技巧匯總》、《JavaScript遍歷算法與技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
- asp.net(c#)網(wǎng)頁跳轉(zhuǎn)七種方法小結(jié)
- javascript 網(wǎng)頁跳轉(zhuǎn)的方法
- 網(wǎng)頁自動跳轉(zhuǎn)代碼收集
- Jquery實現(xiàn)網(wǎng)頁跳轉(zhuǎn)或用命令打開指定網(wǎng)頁的解決方法
- 實現(xiàn)網(wǎng)頁頁面跳轉(zhuǎn)的幾種方法(meta標(biāo)簽、js實現(xiàn)、php實現(xiàn))
- javascript實現(xiàn)倒計時N秒后網(wǎng)頁自動跳轉(zhuǎn)代碼
- 讓網(wǎng)頁跳轉(zhuǎn)到指定位置的jquery代碼非書簽
- 基于JS實現(xiàn)移動端訪問PC端頁面時跳轉(zhuǎn)到對應(yīng)的移動端網(wǎng)頁
- JS實現(xiàn)點擊網(wǎng)頁判斷是否安裝app并打開否則跳轉(zhuǎn)app store
- jQuery如何跳轉(zhuǎn)到另一個網(wǎng)頁 就這么簡單
相關(guān)文章
JavaScript實現(xiàn)圖片DIV豎向滑動的方法
這篇文章主要介紹了JavaScript實現(xiàn)圖片DIV豎向滑動的方法,涉及javascript操作div層的相關(guān)技巧,需要的朋友可以參考下2015-04-04淺談js圖片前端預(yù)覽之filereader和window.URL.createObjectURL
下面小編就為大家?guī)硪黄獪\談js圖片前端預(yù)覽之filereader和window.URL.createObjectURL。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-06-06百度坐標(biāo)(BD09)、國測局坐標(biāo)(火星坐標(biāo),GCJ02)、和WGS84坐標(biāo)系之間的轉(zhuǎn)換
這篇文章主要介紹了百度坐標(biāo)(BD09)、國測局坐標(biāo)(火星坐標(biāo),GCJ02)、和WGS84坐標(biāo)系之間的轉(zhuǎn)換的相關(guān)資料,需要的朋友可以參考下2016-02-02