2010-06-23 15 views
6

En este FF oculta todos los divs y luego muestra el id que fue seleccionado en el menú '#rule_rule_type', que es el comportamiento esperado. En IE 8 no oculta todos de div id:jQuery ocultar() no funciona como se esperaba en el IE 8

<script type="text/javascript" charset="utf-8"> 
    (function($){ 
    $('#rule_rule_type').change(function() { 
     $('#allowed_senders, #blocked_senders, #blocked_character_set, #custom').hide(); 
     var id = $(this).val(); 
     $('#' + id).show(); 
    }); 
    })(jQuery); 
</script> 

Sin embargo, esto no funciona en IE 8:

<script type="text/javascript" charset="utf-8"> 
    (function($){ 
    $('#rule_rule_type').change(function() { 
     $('#allowed_senders').hide(); 
     $('#blocked_senders').hide(); 
     $('#blocked_character_set').hide(); 
     $('#custom').hide(); 
     var id = $(this).val(); 
     $('#' + id).show(); 
    }); 
    })(jQuery); 
</script> 

Ésta es desordenado. ¿Cómo puedo limpiar esto para ser más conciso y aún así trabajar en IE 8?

gracias
Castillo viruta
http://invoicethat.com

+1

funciona bien para mí: ¿Qué tipo de documento http://jsfiddle.net/bYzcv/ – user113716

+2

está usando en su página HTML? También asegúrese de que no haya dos elementos con el mismo 'id' en su página. – Behrang

+3

¿Qué versión de jQuery? Me he dado cuenta de que incluso jQuery 1.3.2 tiene rarezas con IE8 que se fijaron en algún lugar de la línea 1.4.x. – Powerlord

Respuesta

0

no he visto el código HTML, pero la forma en que nombró y referenciada sus identificaciones anterior sugiere que pueda estar utilizando el mismo ID de más de una vez. Solo una suposición.

+0

Los identificadores de seguro de mirada única a mí. ¿Qué pasa con su código sugiere lo contrario? – user113716

0

Ha intentado validar el documento HTML? No sé si esto funciona, pero una forma más ...

0

¿Qué ocurre si agrega una clase a todos los DIV que muestra y oculta, y luego utiliza este código ligeramente reformulado? En este ejemplo, deberá añadir "classofalldivs" como clase para aquellos divs que desea modificar:

(function($){ 
    $('#rule_rule_type').change(function() { 
     var id = $(this).val(); 
     $('#' + id).show(); 
     $('.classofalldivs:not(' + '#' + id+ ')').hide(); 
    }); 
    })(jQuery); 

Este utiliza el "no" de pseudo-selector para ocultar todo, pero el div que está mostrando, y tiene la oportunidad de trabajar tanto en IE como en FF.

Una vez dicho esto, yo estaría de acuerdo con las demás indicaciones que no parece que su código original para mirar mal, por lo que puede haber otras cosas extrañas sucediendo. ¿Puedes publicar un ejemplo completo y completo de tu problema para que otros puedan reproducirlo?

1

estoy corriendo su muestra muy bien en IE8 y Chrome. ¿Es diferente de alguna manera?

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>jQuery Sandbox</title> 
</head> 
<body> 

    <select id='rule_rule_type'> 
     <option value="allowed_senders">allowed_senders</option> 
     <option value="blocked_senders">blocked_senders</option> 
     <option value="blocked_character_set">blocked_character_set</option> 
     <option value="custom">custom</option> 
    </select> 

    <hr /> 

    <div id="allowed_senders">#allowed_senders</div> 
    <div id="blocked_senders">#blocked_senders</div> 
    <div id="blocked_character_set">#blocked_character_set</div> 
    <div id="custom">#custom</div> 

    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript"> 

     $(function() { 

      $('#rule_rule_type').change(function() { 

       $('#allowed_senders, #blocked_senders, #blocked_character_set, #custom').hide(); 

       var id = $(this).val(); 
       $('#' + id).show(); 

      }); 

     }); 

    </script> 
</body> 
</html> 
Cuestiones relacionadas