<!DOCTYPE html>
<html>
<head>
<!-- http://www.lawebdelprogramador.com -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type='text/javascript'>
$(document).ready(function(){ // evento que se ejecuta cuando el select cambia de valor
$("#s1").change(function() { // comprovamos si tiene el estilo asignado
if($("#s1 option:selected").hasClass("selected")) { // añadimos este estilo al objeto seleccionado
$("#s1 option:selected").removeClass("selected"); }else{ // añadimos este estilo al objeto seleccionado
$("#s1 option:selected").addClass("selected"); }
});
});
</script>
<style>
/* Definimos el estilo que tendra el valor seleccionado */
.selected {background-color:red;} </style>
</head>
<body>
<h1>Mostramos como cambiar el fondo del option seleccionado</h1>
<form>
<select id="s1" multiple>
<option value='1'>option 1</option>
<option value='2'>option 2</option>
<option value='3'>option 3</option>
<option value='4'>option 4</option>
</select>
</form>
</body>
</html>
Crear cuenta
Comentarios sobre la versión: Versión 1 (0)
No hay comentarios