display:none ne fonctionne pas sous IE7

Situation:-
J'ai créé un composant RadioButton groupe. Lorsqu'un Utilisateur sélectionne un bouton radio, selon son choix, le contenu est affiché et l'autre le contenu est supprimé.

Problème:-
La page fonctionne correctement dans tous les navigateurs, sauf IE7. J'ai besoin d'une solution qui s'exécute dans IE7 aussi.

Code:-

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>IE7 Bug display:none</title>
    <style>
        #entireContent, #div1, #div2{
            display:block;
        }
    </style>
    <script type="text/javascript">
        function displayDiv1(){
            document.getElementById('div1').setAttribute('style','display:&quot');
            document.getElementById('div2').setAttribute('style','display:none');

        }
        function displayDiv2(){
            document.getElementById('div1').setAttribute('style','display:none');
            document.getElementById('div2').setAttribute('style','display:&quot');  
        }
    </script>
</head>
<body>
    <div id="entireContent">
        <input type="radio" name="group" value="t1" onclick="displayDiv1()">TEST 1<br>
        <input type="radio" name="group" value="t2" onclick="displayDiv2()">TEST 2<br>
        <div id="div1">TEST 1</div>
        <div id="div2">TEST 2</div>
    </div>
</body>
</html>

Ressources Visées:-
http://www.positioniseverything.net/explorer/ienondisappearcontentbugPIE/index.htm

J'ai essayé l'approche indiquée dans la ressource, il ne fonctionne pas.

Merci de m'aider à résoudre ce problème.
Merci à l'Avance.

Qu'est-ce que l'affichage:&quot ?
'display:&quot' est certainement pas correct. Où est le cours de clôture?
'display:&quot' est similaire à l'écran:". Le but était de supprimer l'affichage de la propriété de style de l'élément.

OriginalL'auteur vedvrat13 | 2010-11-10

  1. 5

    Vous pouvez essayer ceci à la place:

    Pour Afficher:

    document.getElementById('element_id').style.display = 'block';

    À Cacher:

    document.getElementById('element_id').style.display = 'none';

    Qui devrait fonctionner.

    OriginalL'auteur Sarfraz

  2. 4

    Si je suis d'accord vous devez accéder à la propriété à l'aide de .style.display je voudrais faire une remarque de la bonne façon de modifier les attributs des éléments.

    document.getElementById('div2').setAttribute('style','display:&quot');

    Ce ne sera pas émuler .style.display='' que ce n'est pas la bonne syntaxe de l'attribut (css) et même si cette partie était d'accord, il y a une seule citation, donc dans cet état d'esprit que vous définissez l'attribut d'affichage égale au reste de l'ensemble du document.

    La bonne façon d'annuler un attribut est l'aide de l' removeAttribute fonction, comme ceci:

    document.getElementById('div1').setAttribute('style','display:none');
document.getElementById('div2').removeAttribute('style');

    OriginalL'auteur Flygenring

  3. 0

    essayez d'utiliser

    document.GetElementById('div1').style.display = "block";
document.GetElemebtById('div2').style.display = "none";
    Merci Tim. La solution que vous avez fourni a résolu mon problème.

    OriginalL'auteur Tim B James