Question déroulantes sur réponse FAQ
Résolu
Patoch250
Messages postés
69
Statut
Membre
-
Patoch250 Messages postés 69 Statut Membre -
Patoch250 Messages postés 69 Statut Membre -
Bonjour,
Suite à une mission donnée par mon maître de stage je dois créer un Intranet avec une partie FAQ où lorsque l'on clique sur la question celle ci déroule en dessous la réponse. Mon problème c'est qu'il faut que je partage les questions en plusieurs parties. J'ai donc un problème pour apeler le code Javascript dans les différentes classe html. Voici le code pour vous faciliter la compréhension. Merci d'avance.
<script type="text/javascript">
if(!window.Node){
var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3};
}
function checkNode(node, filter){
return (filter == null || node.nodeType == Node[filter] || node.nodeName.toUpperCase() == filter.toUpperCase());
}
function getChildren(node, filter){
var result = new Array();
var children = node.childNodes;
for(var i = 0; i < children.length; i++){
if(checkNode(children[i], filter)) result[result.length] = children[i];
}
return result;
}
function getChildrenByElement(node){
return getChildren(node, "ELEMENT_NODE");
}
function getFirstChild(node, filter){
var child;
var children = node.childNodes;
for(var i = 0; i < children.length; i++){
child = children[i];
if(checkNode(child, filter)) return child;
}
return null;
}
function getFirstChildByText(node){
return getFirstChild(node, "TEXT_NODE");
}
function getNextSibling(node, filter){
for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){
if(checkNode(sibling, filter)) return sibling;
}
return null;
}
function getNextSiblingByElement(node){
return getNextSibling(node, "ELEMENT_NODE");
}
// Menu Functions & Properties
var activeMenu = null;
function showMenu() {
if(activeMenu){
activeMenu.className = "";
getNextSiblingByElement(activeMenu).style.display = "none";
}
if(this == activeMenu){
activeMenu = null;
} else {
this.className = "active";
getNextSiblingByElement(this).style.display = "block";
activeMenu = this;
}
return false;
}
function initMenu(){
var menus, menu, menu2, menus2, text, a, i;
menus = getChildrenByElement(document.getElementById("faq"));
menus2 = getChildrenByElement(document.getElementById("faq2"));
for(i = 0; i < menus.length; i++){
menu = menus[i];
text = getFirstChildByText(menu);
a = document.createElement("a");
menu.replaceChild(a, text);
a.appendChild(text);
a.href = "#";
a.onclick = showMenu;
a.onfocus = function(){this.blur()};
}
}
Suite à une mission donnée par mon maître de stage je dois créer un Intranet avec une partie FAQ où lorsque l'on clique sur la question celle ci déroule en dessous la réponse. Mon problème c'est qu'il faut que je partage les questions en plusieurs parties. J'ai donc un problème pour apeler le code Javascript dans les différentes classe html. Voici le code pour vous faciliter la compréhension. Merci d'avance.
<script type="text/javascript">
if(!window.Node){
var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3};
}
function checkNode(node, filter){
return (filter == null || node.nodeType == Node[filter] || node.nodeName.toUpperCase() == filter.toUpperCase());
}
function getChildren(node, filter){
var result = new Array();
var children = node.childNodes;
for(var i = 0; i < children.length; i++){
if(checkNode(children[i], filter)) result[result.length] = children[i];
}
return result;
}
function getChildrenByElement(node){
return getChildren(node, "ELEMENT_NODE");
}
function getFirstChild(node, filter){
var child;
var children = node.childNodes;
for(var i = 0; i < children.length; i++){
child = children[i];
if(checkNode(child, filter)) return child;
}
return null;
}
function getFirstChildByText(node){
return getFirstChild(node, "TEXT_NODE");
}
function getNextSibling(node, filter){
for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){
if(checkNode(sibling, filter)) return sibling;
}
return null;
}
function getNextSiblingByElement(node){
return getNextSibling(node, "ELEMENT_NODE");
}
// Menu Functions & Properties
var activeMenu = null;
function showMenu() {
if(activeMenu){
activeMenu.className = "";
getNextSiblingByElement(activeMenu).style.display = "none";
}
if(this == activeMenu){
activeMenu = null;
} else {
this.className = "active";
getNextSiblingByElement(this).style.display = "block";
activeMenu = this;
}
return false;
}
function initMenu(){
var menus, menu, menu2, menus2, text, a, i;
menus = getChildrenByElement(document.getElementById("faq"));
menus2 = getChildrenByElement(document.getElementById("faq2"));
for(i = 0; i < menus.length; i++){
menu = menus[i];
text = getFirstChildByText(menu);
a = document.createElement("a");
menu.replaceChild(a, text);
a.appendChild(text);
a.href = "#";
a.onclick = showMenu;
a.onfocus = function(){this.blur()};
}
}
3 réponses
-
je n'ai pas lu tout ton code mais si tu veux juste afficher la réponse en dessous lorsqu'il clique sur la question voila ce que je propose :
<a href="javascript:;" onclick="javascript:show('contenu1')"> ma qestion ici </a> <div id="contenu1" style="display:none"> coucou j'apparait </div> <br/> <a href="javascript:;" onclick="javascript:show('contenu2')"> cliquer ici</a> <div id="contenu2" style="display:none"> salut </div> <script type="text/javascript"> function show(indice) { if (document.getElementById(indice).style.display=="none") document.getElementById(indice).style.display="block"; else document.getElementById(indice).style.display="none"; } </script> -
Personne ne peut m'aider ou personne n' a compris ce que je demande. Parce que sinon je reformule.
-
Il faudrait que je crée une classe dans le code Javascript pour que je puisse le réutilisé n'importe dans mon HTML
