dans FF Ceci cache toutes les divs, puis affiche l'ID sélectionné dans le menu '#RULE_RULE_TYPE', qui est le comportement attendu. Dans IE 8, il ne cache pas tous les identifiants de div: Cependant, cela fonctionne dans IE 8: p> <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>
4 Réponses :
Je n'ai pas vu votre HTML, mais la façon dont vous avez nommé et référencé vos identifiants ci-dessus suggère que vous utilisez le même ID plus d'une fois. Juste une supposition. P>
Les identifiants sont sûrs à moi. Qu'en est-il de son code suggère autrement?
Avez-vous essayé de valider votre document HTML? Je ne sais pas si cela fonctionne, mais un moyen de plus ... p>
Que se passe-t-il si vous ajoutez une classe à toutes les DIV que vous affichez et que vous vous cachez, puis utilisez ce code légèrement repharmé? Dans cet exemple, vous ajouteriez «Classowalldivs» comme une classe à ces DIV que vous souhaitez affecter:
(function($){ $('#rule_rule_type').change(function() { var id = $(this).val(); $('#' + id).show(); $('.classofalldivs:not(' + '#' + id+ ')').hide(); }); })(jQuery);
Je gère votre échantillon juste bien dans IE8 et Chrome. Est-ce différent d'une certaine manière?
<!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>
Fonctionne bien pour moi: jsfiddle.net/byzcv
Quel Doctype utilisez-vous dans votre page HTML? Assurez-vous également qu'il n'y a pas deux éléments avec le même
ID code> dans votre page.
Quelle version de jQuery? J'ai remarqué que même JQuery 1.3.2 a des bizarreries étranges avec IE8 qui ont été fixées quelque part dans la ligne 1.4.x.