Slecte un select

by kapry

HTML

<!doctype html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>Jquery multiselected</title>
    <!-- Jquery 3.2.1  -->
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#opciones').change(function () {
                $.each($(this).val(), function(i, val){
                    // val es wl valor de la opcion selecionada
                    if(val=='Ninuguno'){ // si selecion Ninguno desmarca al resto de las opciones
                        $("#opciones option[value='Amarillo'],[value='Azul'],[value='Rojo']").prop("selected", false);
                        $("#opciones option[value='Ninuguno']").prop("selected", true);
                    }else{
                        // si se lecciona culauquier opcion que no sea Ninguno
                        $("#opciones option[value='Ninuguno']").prop("selected", false);
                        switch (val) {
                            case 'Amarillo':
                                $("#opciones option[value='Amarillo']").prop("selected", true);
                                break;
                            case 'Azul':
                                $("#opciones option[value='Azul']").prop("selected", true);
                                break;
                            case 'Rojo':
                                $("#opciones option[value='Rojo']").prop("selected", true);
                                break;
                        }

                    }
                });
            });

        })
    </script>
</head>
<body>
<select id="opciones" multiple="multiple" >
    <option value="Ninuguno" selected>Ninuguno</option>
    <option value="Amarillo">Amarillo</option>
    <option value="Azul">Azul</option>
    <option value="Rojo">Rojo</option>
</select>
</body>
</html>