Question

我是新手，并不知道我在做什么。每当我尝试打开菜单时，它都不会下降而且非常小。这是我的代码：

<html>
<head>
</head>
<body>
<select name="menu" id="menu">
<select onChange="location=this.options[this.selectedIndex].value;" style="color:#fff;background-color:#FFFFFF;highlight: #CCCCCC;font-family:minecraftia_1_;font-size:8px;">
<option value=""></option>
<option style="background: #FFCCFF;" value="http://www.google.com">title 1</option>
<option style="background: #FFCC99;" value="http://www.google.com">title 2</option>
<option style="background: #FFFF99;" value="http://www.google.com">title 3</option>
<option style="background: #CCFFCC ;" value="http://www.google.com">title 4</option>
<option style="background: #99CCFF ;" value="http://www.google.com">title 5</option>
<option style="background:#9999CC;" value="http://www.google.com">title 6</option>
<option style="background: #CC99CC;" value="http://www.google.com">title 7</option>
</select>
<script type="text/javascript">
var urlmenu = document.getElementById( 'menu' );
urlmenu.onchange = function() {
window.open( this.options[ this.selectedIndex ].value );
};
</script>
</body>
</html>

Answer 1

试试这个： - http://jsfiddle.net/adiioo7/6jG4S/

<强> HTML： -

<select name="menu" id="menu" style="color:#fff;background-color:#FFFFFF;highlight: #CCCCCC;font-family:minecraftia_1_;font-size:8px;">
        <option value=""></option>
        <option style="background: #FFCCFF;" value="http://www.google.com">title 1</option>
        <option style="background: #FFCC99;" value="http://www.google.com">title 2</option>
        <option style="background: #FFFF99;" value="http://www.google.com">title 3</option>
        <option style="background: #CCFFCC ;" value="http://www.google.com">title 4</option>
        <option style="background: #99CCFF ;" value="http://www.google.com">title 5</option>
        <option style="background:#9999CC;" value="http://www.google.com">title 6</option>
        <option style="background: #CC99CC;" value="http://www.google.com">title 7</option>
    </select>

<强> JS： -

var urlmenu = document.getElementById('menu');
urlmenu.onchange = function () {
    window.open(this.options[this.selectedIndex].value);
};

Answer 2

试试这个：http://jsfiddle.net/Fp9mH/

JS：

$(document).ready(function() {
    $('#menu').change(function() {
    window.open( this.value );
    });
});

HTML：

<select name="menu" id="menu" style="color:#fff;background-color:#FFFFFF;highlight: #CCCCCC;font-family:minecraftia_1_;font-size:8px;">
<option value=""></option>
<option style="background: #FFCCFF;" value="http://www.google.com">title 1</option>
<option style="background: #FFCC99;" value="http://www.google.com">title 2</option>
<option style="background: #FFFF99;" value="http://www.google.com">title 3</option>
<option style="background: #CCFFCC ;" value="http://www.google.com">title 4</option>
<option style="background: #99CCFF ;" value="http://www.google.com">title 5</option>
<option style="background:#9999CC;" value="http://www.google.com">title 6</option>
<option style="background: #CC99CC;" value="http://www.google.com">title 7</option>
</select>

下拉菜单链接不起作用？

2 个答案:

试试这个： - http://jsfiddle.net/adiioo7/6jG4S/