Afficher / Masquer la div avec jscript

Je regardais tout autour du site et je ne pouvais pas trouver une réponse qui est ce que je veux. Peut-être ma connaissance est tout simplement trop petit pour cela, mais im essayant d'en apprendre plus et plus.

Voici la chose, j'ai ce site web avec plusieurs films et après avoir fait une recherche dans ma db j'ai renvoyer uniquement les données essentielles pour l'utilisateur avec les films qui correspondent à la recherche de paramètre, le reste des données que je veux mettre dans une div avec l'option pour AFFICHER et MASQUER la même div.

C'est ce que j'ai à ce jour:

<script type='text/javascript'>
function showDiv() {
   document.getElementById('hiddenDiv').style.display = "block";
}
</script>

<div id="hiddenDiv"  style="display:none;" class="answer_list" > WELCOME</div>
<input type="button" name="answer" value="Show Div" onclick="showDiv()" />

Détail: Im de tout imprimer avec php echo.

Merci beaucoup!

Informations supplémentaires:

De tous les résultats sont affichés dans la même page, ce qui signifie que tous les divs ont le même nom.

J'ai changer mon div code:

echo "<div id='$dados[id]'  style='display:none;' class='answer_list' >";

$dados[id] returns me the id of the data in my db.

I want to change:

document.getElementById('hiddenDiv') to something like document.getElementById('$dados[id') <-- Shows only the last div.

Peut-il être fait?

Résultat provient de:

while ($dados = mysql_fetch_array($query))

Regarde dans l'aide de jquery. api.jquery.com/show et api.jquery.com/hide
La mise en œuvre de jQuery uniquement pour masquer/afficher une div, c'est comme prendre un F18 vers les magasins.
w3schools.com/css/css_display_visibility.asp
Où est votre hideDiv fonction?
Je N'ai pas fais tout hideDiv encore @codinbiz

InformationsquelleAutor Henrique Souza | 2013-01-07

1

Essayez ceci:
```
<script type='text/javascript'>
    function showDiv() {
        if (document.getElementById('hiddenDiv').style.display == 'block') {
            document.getElementById('hiddenDiv').style.display = 'none';
        } else {
            document.getElementById('hiddenDiv').style.display = 'block';
        }
    }
</script>
<div id="hiddenDiv"  style="display:none;" class="answer_list" >
    WELCOME
</div>
<input type="button" name="answer" value="Show Div" onclick="showDiv()" />
```
Une fonction ne tous les. Cela étant dit, jQuery bascule est vraiment sympa.
- Ok, nous y voilà: Le bouton afficher/masquer les a bien fonctionné mais seulement pour la première conséquence, sur les autres résultats, si je clique sur le bouton pour afficher/masquer les informations supplémentaires, il affiche/masque le premier résultat d'info
- Je crois qu'avec JQuery serait plus facile, je vais essayer Jirilmon George de code plus tard, pour vérifier si cela fonctionne.
- Je pense que j'ai trouvé le problème. Comme tous les résultats sont affichés dans la même page, tous les divs ont le même nom (hiddenDiv). Chaque ensemble de données dans ma db avoir un ID, je vais être de nommage des divs avec cette ID, comment puis-je faire de même avec JScript ElementID?
- Passer l'ID dans la fonction showDiv(). Après cela, function showDiv() { devrait être function showDiv(id) {. Ensuite, chaque document.getElementById('hiddenDiv').style.display devrait être document.getElementById('hiddenDiv' + id).style.display
InformationsquelleAutor SeanWM

<script type='text/javascript'>
function showDiv() {
   document.getElementById('hiddenDiv').style.display = "block";
   document.getElementById('showDivButton').style.display = "none";
}
function hideDiv() {
   document.getElementById('hiddenDiv').style.display = "none";
   document.getElementById('showDivButton').style.display = "block";
}
</script>

<div id="hiddenDiv"  style="display:none;" class="answer_list" >
  WELCOME
  <input type="button" id="hideDivButton" value="Hide Div" onclick="hideDiv()" />
</div>
<input type="button" id="showDivButton" value="Show Div" onclick="showDiv()" />

ou utiliser un framework, tels que le Dojo (ou même jQuery, si elle ne peut absolument pas être aidé)

InformationsquelleAutor Eugen Rieck

Exemple De Code Javascript + Html:

<script language="javascript"> 
function toggle() {
    var ele = document.getElementById("toggleText");
    var text = document.getElementById("displayText");
    if(ele.style.display == "block") {
        ele.style.display = "none";
        text.innerHTML = "show";
    } else {
        ele.style.display = "block";
        text.innerHTML = "hide";
    }
} 
</script>

<a id="displayText" href="javascript:toggle();">show</a> <== click Here
<div id="toggleText" style="display: none"><h1>peek-a-boo</h1></div>

Remarque: le terme 'toggle' représente afficher /masquer un élément.

Aussi, Voici quelques autres exemples:

http://csscreator.com/node/708#xcomment-3123

http://psoug.org/snippet/Javascript-Smooth-Div-ShowHide_236.htm

InformationsquelleAutor OMG

<script type='text/javascript'>
function showadve() {
    if (document.getElementById('hiddenadve').style.display == 'none') {
        document.getElementById('hiddenadve').style.display = 'block';
    } else {
        document.getElementById('hiddenadve').style.display = 'none';
    }
}
</script>
<div id="hiddenadve" class="answer_list" >
    WELCOME
</div>
<input type="button" name="answer" value="Show Div" onclick="showadve()" />
<a href="#" onclick="showadve()">all close</a>`

c'est le mien

InformationsquelleAutor shota

Vous devez vous connecter pour publier un commentaire.