select中option改变时跳转到其他页面

朱雀 2022-08-05 20:29 313阅读 0赞

html代码：

<div class="friend\_link">  
                        <select οnchange=mbar(this) name="select">  
                            <option selected>友情链接</option>  
                            <option value="http://www.163.com">163</option>  
                            <option value="http://www.flash8.net/">flash8</option>  
                            <option value="http://www.baidu.com">百度</option>  
                            <option value="http://www.baidu.com">百度</option>  
                            <option value="http://www.baidu.com">百度</option>  
                            <option value="http://www.baidu.com">百度</option>  
                        </select>

</div>

js代码：

效果如下图：

![Center][]

跳转到百度试试：

![Center 1][]

原理是当select中选中的值改变的时候，获取value值，使用open函数，跳转到这个value所指定的url。

了解一下open函数：

window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no')

window.open 弹出新窗口的命令；   
'page.html' 弹出窗口的文件名；   
'newwindow' 弹出窗口的名字（不是文件名），非必须，可用空''代替；   
height=100 窗口高度；   
width=400 窗口宽度；   
top=0 窗口距离屏幕上方的象素值；   
left=0 窗口距离屏幕左侧的象素值；   
toolbar=no 是否显示工具栏，yes为显示；   
menubar，scrollbars 表示菜单栏和滚动栏。   
resizable=no 是否允许改变窗口大小，yes为允许；   
location=no 是否显示地址栏，yes为允许；   
status=no 是否显示状态栏内的信息（通常是文件已经打开），yes为允许；   
</SCRIPT> js脚本结束

[Center]: /images/20220806/36433149066144ae96faa80a63da2934.png
[Center 1]: /images/20220806/c39de9dd59e04dd1a22e55fcffeb3a76.png