Foros del Web » Creando para Internet » CSS »

CSS para cuando los controles estén Disabled con JavaScript

Estas en el tema de CSS para cuando los controles estén Disabled con JavaScript en el foro de CSS en Foros del Web. Alguno que me pueda ayudar, en estos me encuentro con el siguiente problema que estoy con formulario donde tengo que hacerle algunos controles con JavaScript ...
  #1 (permalink)  
Antiguo 18/12/2008, 12:00
 
Fecha de Ingreso: marzo-2003
Mensajes: 524
Antigüedad: 14 años, 8 meses
Puntos: 2
CSS para cuando los controles estén Disabled con JavaScript

Alguno que me pueda ayudar, en estos me encuentro con el siguiente problema que estoy con formulario donde tengo que hacerle algunos controles con JavaScript un Disabled, lo cual en el navegador visualmente el objeto HMTL se coloca de colores grises claros lo que hace para el usuario que vea el formulario no note lo que este escrito dentro de los ComboBox y si están Checkeados los CheckBox, me dijeron que podría solucionar esto con un CSS pero me encuentro algo perdido. Este codigo aplica para los ComboBox en FireFox y no IE, también no funciona para CheckBox ya sea FireFox o IE.




Saludos

Código PHP:
<html>
  <
head>
  
   <
style>
     .
miclase 
          
background-color#FFFFFF;
          
color:#000000 ;
      
}
   </
style>
  </
head>
  <
body>
         <
select id=combo1>
                  <
option>contenido1</option>
                  <
option>contenido2</option>
                  <
option>contenido3</option>
         </
select>

         <
select id=combo2>
                  <
option>contenido4</option>
                  <
option>contenido5</option>
                  <
option>contenido6</option>
         </
select>
         <
input name="radiobutton" type="radio" value="radiobutton">
         <
input type="checkbox" name="checkbox" value="checkbox">
  <
br>
   <
br>
   <
a href="javascript:disable();">disable</a>
   <
a href="javascript:enable();">enable</a>
  </
body>
</
html>

<
script language="javascript">
   function 
disable() {
      var 
combo1 document.getElementById('combo1');
      var 
combo2 document.getElementById('combo2');
      var 
radiobutton document.getElementById('radiobutton');
      var 
radiobutton document.getElementById('checkbox');

       
combo1.disabled  true;
       
combo1.className "miclase";
       
       
combo2.disabled  true;
       
combo2.className "miclase";
       

       
radiobutton.className "miclase";
       
       
checkbox.disabled  true;
       
checkbox.className "miclase";

   }
   function 
enable() {
      var 
combo1 document.getElementById('combo1');
      var 
combo2 document.getElementById('combo2');
     var 
radiobutton document.getElementById('radiobutton');
       
combo1.disabled  false;
       
combo1.className "";
       
       
combo2.disabled  false;
       
combo2.className "";
       
        
radiobutton.disabled  false;
       
radiobutton.className "";
       
checkbox.disabled  false;
                 
checkbox.className "";
   }
</script> 
  #2 (permalink)  
Antiguo 20/12/2008, 00:12
Avatar de trasgukabi  
Fecha de Ingreso: septiembre-2004
Mensajes: 2.749
Antigüedad: 13 años, 3 meses
Puntos: 18
Respuesta: CSS para cuando los controles estén Disabled con JavaScript

de aqui podras sacar lo que necesitas
**sacado de
HTMLCODETUTORIAL
Code:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
.disabled {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 10px;
   font-weight: bold;
   color: #000000;
   background-color: #666666;
   border: 1px solid #000000;
}
.enabled {
   font-family: "Times New Roman", Times, serif;
   font-size: 12px;
   font-weight: bold;
   color: #0000FF;
   background-color: #CCCCCC;
   border: 1px solid #0000FF;
}
-->
</style>
</head>

<body>
<form name="form1" id="form1" method="post" action="">
  <input type="button" name="Button" value="Button" class="enabled" onclick="this.disabled=true;this.className='disabled';"/>
</form>
</body>
</html> 
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:14.