[SOLUCIONADO] Menu select

manelmanel8 · #1 (**permalink**) 17/11/2014, 15:44

Tengo este select y me gustaría que al seleccionar una opción ir a ese enlace.

Código HTML:

<div class="select-menu">
<select>
<option style="display:none;" selected="" disabled="" value="">Menú</option>
<option value="index.php">inici</option>
<option value="cinema.php">cinema</option>
<option value="publicitat.php">publicitat</option>
<option value="esdeveniments.php">esdeveniments</option>
<option value="galeria.php">galeria</option>
<option value="clients.php">clients</option>
<option value="quisom.php">qui som?</option>
<option value="contacta.php">contacta</option>
</select>
</div>

Gracias

Alexis88 · #2 (**permalink**) 17/11/2014, 16:25

Cuando se produzca el evento change en la lista contenida en el <div> de clase 'select-menu', realizas la redirección.

Código Javascript:

Ver original$(".select-menu select").on("change", function(){
    $(location).prop("href", this.value);
});

Saludos

manelmanel8 · #3 (**permalink**) 18/11/2014, 04:30

No me funciono :( Tengo el div .select-menu dentro de una etiqueta nav y la etiqueta nav dentro de otra etiqueta header.

Puede que por eso no funcione?

Saludos

mauritosuarez · #4 (**permalink**) 18/11/2014, 05:23

Hola manelmanel8, prueba con este código.

Código HTML:

Ver original<!DOCTYPE html>
<html lang="">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        // Optengo el valor del combo
        $('#opciones').change(function() {
            var opc = $("#opciones").val();
            
            alert(opc);
            
            window.location.href = opc;
        });
    });
    </script>
</head>
 
<body>
<div class="select-menu">
    <select id="opciones">
        <option style="display:none;" selected="" disabled="" value="">Menú</option>
        <option value="index.php">inici</option>
        <option value="cinema.php">cinema</option>
        <option value="publicitat.php">publicitat</option>
        <option value="esdeveniments.php">esdeveniments</option>
        <option value="galeria.php">galeria</option>
        <option value="clients.php">clients</option>
        <option value="quisom.php">qui som?</option>
        <option value="contacta.php">contacta</option>
    </select>
</div> 
</body>
</html>

Espero te sirva.

Saludos.

Alexis88 · #5 (**permalink**) 18/11/2014, 11:44

Fíjate en este ejemplo: Código y Demo.

Es bastante similar a lo que dices tener y funciona perfectamente. Compáralo con lo que has hecho y corrige lo que esté mal.

Saludos

manelmanel8 · #6 (**permalink**) 18/11/2014, 14:19

Gracias a los dos, al principio no me funcionaba… Pero ahora todo correcto con los dos códigos.

Muchas gracias.

Saludos