Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal... tem um script que eu to precisando... eh o seguinte...
Tenho um site que possui menus. (óbvio) ;) e esses menus tem subitens...
Preciso de um script que quando eu clique, ele abra uma td da tabela, e qdo eu clique em outro item, ele feche o td abreto, e abra o que eu cliquei......
Obs.: eu tenho somente o script que abre a td, e se clicar denovo, ela fecha, mas nao sei como incluir o novo evento... Segue abaixo o codigo que eu uso.... (nao precisa ser necessariamente o mesmo código
<html><head><title>Untitled Document</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head><body><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr onclick="javascript:if (document.all){if (conteudo.style.display=='none'){conteudo.style.display='block'}else{conteudo.style.display='none'}}" style='cursor:hand;'> <td>Clique aqui !!!!</td> </tr> <tr> <td><script language='javascript'>if (document.all){document.write('<div id=conteudo style=display:none;>')}</script>aaaa ddddd <script language='javascript'>if (document.all){document.write('</div>')}</script></td> </tr> <tr onclick="javascript:if (document.all){if (conteudo2.style.display=='none'){conteudo2.style.display='block'}else{conteudo2.style.display='none'}}" style='cursor:hand;'> <td>Clique aqui tbm...</td> </tr> <tr> <td><script language='javascript'>if (document.all){document.write('<div id=conteudo2 style=display:none;>')}</script> fasfasdsadafadf <script language='javascript'>if (document.all){document.write('</div>')}</script></td> </tr></table><br><br><br>Gostaria que qdo eu clicasse no clique aqui tbm... (com o Clioque aqui!!! aberto)fechasse o primeiro, e só daí abrisse o segundo.... </body></html>
Valeu galera...
Alica CWB
himon,muitissimo obrigada, era exatamente isso que eu procurava, só que tem um pequeno "bug"...se eu abrir o item 1, fechar o item 1, e tentar abrir denovo ele (tudo em sequencia), ele nao abre... :blink: Será que eh facil de resolver isso ???Alica CWB
himon...
Como que eu faço pra colocar o link nos submenus ?? Tentei isso mas nao deu certo...
itens[1] = "<strong>• Administrativo</strong>";itens[2] = "<strong>• Gerenciamento</strong>";itens[3] = "<strong>• Documento</strong>";subitens[1] = "<a href=\"#\"• Categoria</a><a href=\"#\" • Fornecedores</a><a href=\"#\" • Interno</a>";subitens[2] = "<a href=\"#\"• Categoria</a><a href=\"#\" • Fornecedores</a><a href=\"#\" • Interno</a>";subitens[3] = "• Grupo/• Disciplina/• Conjunto";subitens[4] = "• Usuário/• Tipo de documento";
Como que eu faço pra que ao inves de abrir pra baixo, abra pro lado, e para as opçoes ficarem uma do lado da outra tbm ???
Alica CWB
nesse trecho do código, adicione a parte em negrito:
>
...
function teste(n){
if(aux==n){
e = document.all["item"+n];
e.innerHTML = "";
**aux = 0;**
}else{
...quanto a adicionar link:
itens[1] = "<strong>• Administrativo</strong>"; itens[2] = "<strong>• Gerenciamento</strong>"; itens[3] = "<strong>• Documento</strong>"; subitens[1] = " <a href=\"#\">• Categoria</a>| <a href=\"#\">• Fornecedores</a>| <a href=\"#\">• Interno</a>"; subitens[2] = " <a href=\"#\">• Categoria</a>| <a href=\"#\">• Fornecedores</a>| <a href=\"#\">• Interno</a>"; subitens[3] = " • Grupo| • Disciplina| • Conjunto";você esqueceu de fechar a tag <a href> por isso ficava vazio
a outra dúvida não entendi muito bem, tem como explicar melhor ou mostrar um exemplo?
himon....
<html><head><title>A1DOC - Gerenciamento de Documentos On-line</title><?php include ("padrao.css") ?><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head><body bgcolor="#006699" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"><table width="994" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="3" class="conteudo"> <tr align="center"> <td colspan="4"><font size="4"><strong>A1DOC Gerenciamento de Documentos Online</strong></font></td> </tr> <tr align="center"> <td width="77%" align="left">Logado como: <strong><?php echo "$nome - $group"; ?></strong></td> <td width="11%" colspan="-3" align="right"><?php echo date("d/m/Y"); ?></td> <td width="6%" align="right"><a href="ajuda.php" target="_blank" class="menulink">Sobre</a></td> <td width="6%" align="right"><a href="logoff.php?sc=<?php echo $sc; ?>" target="_top" class="menulink">LogOff</a></td> </tr> <tr align="center"> <td height="9" align="left"></td> </tr> </table> <table width="100%" border="0" cellpadding="0" cellspacing="0" class="conteudo"> <tr> <td colspan="11" align="left" valign="bottom" bgcolor="#006699"></td> </tr> <tr> <td width="6" align="left" bgcolor="#006699"><img src="img/menu_sep4.gif" width="6" height="20" border="0"></td> <td width="90" align="center" valign="top"><img src="img/line_white.gif" width="100%" height="1" align="texttop"><a href="index_frame.php?sc=<?php echo $sc; ?>" target="_top" class="menulink">Home</a></td> <td width="11" align="right"><img src="img/menu_sep3.gif" width="11" height="20" border="0"></td> <td width="90" align="center" valign="top"><img src="img/line_white.gif" width="100%" height="1" align="texttop"><a href="menu_cad.php?sc=<?php echo $sc; ?>" class="menulink">Cadastro</a></td> <td width="11" valign="top"><img src="img/menu_sep.gif" width="11" height="20" border="0"></td> <td width="90" align="center" valign="top" bgcolor="#0099CC"><img src="img/line_white.gif" width="100%" height="1" align="texttop">Trâmite</td> <td width="11" align="left" bgcolor="#006699"><img src="img/menu_sep2.gif" width="11" height="20" border="0"></td> <td width="90" align="center" valign="top"><img src="img/line_white.gif" width="100%" height="1" align="texttop"><a href="pesq_frame.php?sc=<?php echo $sc; ?>" target="_top" class="menulink">Pesquisa</a></td> <td width="11" align="left" bgcolor="#006699"><img src="img/menu_sep3.gif" width="11" height="20" border="0"></td> <td width="90" align="center" valign="top"><img src="img/line_white.gif" width="100%" height="1" align="texttop"><a href="menu_rel.php?sc=<?php echo $sc; ?>" class="menulink">Relatórios</a></td> <td width="499"><img src="img/menu_sep5.gif" width="6" height="20" border="0"></td> </tr> </table> <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#0099CC"> <tr> <td width="12%"><a href="aprovar_etapa_1.php?sc=<?php echo $sc; ?>" target="mainFrame" class="menulink"><strong>• Aprovação</strong></a></td> <td width="12%"><a href="solicitacao_etapa_1.php?sc=<?php echo $sc; ?>" target="mainFrame" class="menulink"><strong>• Solicitação</strong></a></td> <td width="76%"><a href="devolver_etapa_1.php?sc=<?php echo $sc; ?>" target="mainFrame" class="menulink"><strong>• Devolução</strong></a></td> </tr> </table></td> </tr></table></body></html>
itens = new Array();subitens = new Array();itens[1] = "<strong>• Administrativo</strong>";itens[2] = "<strong>• Gerenciamento</strong>";itens[3] = "<strong>• Documento</strong>";subitens[1] = "<a href=\"manut_categorias.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"menulink\">• Categoria</a> <a href=\"manut_menus.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"menulink\">• Menu</a> <a href=\"manut_groups.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"menulink\">• Grupo</a> <a href=\"manut_users.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"menulink\">• Usuário</a>";subitens[2] = "<a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Fornecedores</a> <a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Departamentos</a> <a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Disciplinas</a> <a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Tipos de documentos</a>";subitens[3] = "<a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Interno</a> <a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Externo</a> <a href=\"#\" target=\"mainFrame\" class=\"menulink\">• Conjunto</a>";aux = 0;function teste(n){ if(aux==n){ e = document.all["item"+n]; e.innerHTML = ""; aux = 0; }else{ if(aux!=0){ e = document.all["item"+aux]; e.innerHTML = ""; } aux = n; e = document.all["item"+n]; retornar = ""; vetor = subitens[n].split("|"); for(i=0;i<vetor.length;i++){ retornar += "" + vetor[i]; } e.innerHTML = retornar; }}Obrigada por tudo...
Alica CWB
no corpo do HTML troque por isso:
<table border=0 cellspacing=0 cellpadding=0><tr><script language=javascript> for(i=1;i<itens.length;i++){ if(i>1){ document.write("<td width=10></td>"); } document.write("<td valign=top><a href=\"javascript:;\" onclick=\"teste("+i+");\">"+itens[i]+"</a><span name=item"+i+" id=item"+i+"></span></td>"); }</script></tr></table>
himon...Muitissimo obrigada !!! Deu tudo certo ! :) Valeu mesmo !Alica CWB :huh:
himon...
To precisando da sua ajuda denovo....
Nesse codigo aí embaixo, como que eu posso fazer pra que os subitens sejam exibidos numa nova <tr>? Tentei no script qdo tem retornar"<br>" substitui pra <tr></tr> mas nao deu certo... como que eu posso fazer ???
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>A1 Engenharia e Gerenciamento</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><script language="JavaScript" src="../js/img_rollover.js" type="text/JavaScript"></script><script language="JavaScript" src="../js/menu_layers.js" type="text/JavaScript"></script><script language="JavaScript" type="text/javascript">itens = new Array();subitens = new Array();itens[1] = "<strong>• Administrativo ></strong>";itens[2] = "<strong>• Gerenciamento</strong>";itens[3] = "<strong>• Documento</strong>";subitens[1] = "<a href=\"manut_categorias.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Categoria</a> <a href=\"manut_menus.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Menu</a> <a href=\"manut_groups.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Grupo</a> <a href=\"manut_users.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Usuário</a>";subitens[2] = "<a href=\"fornecedor.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Fornecedores</a> <a href=\"departamento.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Departamentos</a> <a href=\"disciplina.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Disciplinas</a> <a href=\"tipo_documento.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Tipos de documentos</a>";subitens[3] = "<a href=\"cad_int_etapa_1.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Interno</a> <a href=\"cad_ext_etapa_1.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Externo</a> <a href=\"conjunto_etapa_1.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Conjunto</a>";aux = 0;function teste(n){ if(aux==n){ e = document.all["item"+n]; e.innerHTML = ""; aux = 0; }else{ if(aux!=0){ e = document.all["item"+aux]; e.innerHTML = ""; } aux = n; e = document.all["item"+n]; retornar = " "; vetor = subitens[n].split("|"); for(i=0;i<vetor.length;i++){ retornar += "<br> -->" + vetor[i]; } e.innerHTML = retornar; }}</script><link href="../padrao.css" rel="stylesheet" type="text/css"><body background="../images/fundo.gif" text="#000000" link="#000000" vlink="#000000" alink="#666666" leftmargin="5" topmargin="5" marginwidth="5" marginheight="5" onLoad="MM_preloadImages('../images/preview_press.gif','../images/preview_next.gif')"><table width="962" border="0" cellpadding="0" cellspacing="0" id="menu"> <tr> <td width="129" align="left" valign="middle"><img src="../images/logo_fig_menu_intra.gif" width="114" height="69"></td> <td width="340" align="left" valign="middle"><img src="../images/logo_tex_intra.gif" width="153" height="34"></td> <td width="493" height="69" align="center" valign="bottom" background="../images/a1net_fundo_intra.gif"><div id="a1net" style="position:absolute; width:59px; height:8px; z-index:14; left: 723px; top: 16px;"><img src="../images/a1net.gif" width="117" height="37"></div> <div id="data" style="position:absolute; width:98px; height:8px; z-index:14; left: 855px; top: 11px;"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="22" align="center"><strong><font color="#000000" size="1" face="Verdana, Arial, Helvetica, sans-serif"><?php echo date("d/m/Y"); ?></font></strong></td> </tr> <tr> <td height="18" align="center" valign="bottom"><a href="logoff.php<?php echo "?sc=$sc"; ?>" class="mm2"><font color="#990000" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>Efetuar Log off</strong></font></a></td> </tr> </table> </div> <div id="boasvindas" style="position:absolute; width:241px; height:15px; z-index:2; left: 510px; top: 59px;"> <div align="left"><font color="#000000" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong> <?php switch (date("H")) { case (date("H") >= 06) and (date("H") < 12): print "Bom dia "; break; case (date("H") >= 12) and (date("H") < 18): print "Boa tarde "; break; default: print "Boa noite "; break;}echo "$nome";?> </strong></font></div> </div></td> </tr></table><table width="962px" border="0" cellpadding="0" cellspacing="0" bgcolor="#CC9933"> <tr> <td> <table width="962" border="0" cellpadding="0" cellspacing="1" class="textmenu"> <tr align="center"> <td width="18"><a href="index_intra.php?<?php echo "sc=$sc"; ?>"><img src="../images/casa.gif" width="18" height="18" border="0" align="middle"></a></td> <td><script language="javascript">for(i=1;i<itens.length;i++){ document.write("<td bgcolor=\"#FFFFFF\"><a href=\"javascript:;\" onclick=\"teste("+i+");\" class=\"textmenu\">"+itens[i]+"</a><span name=item"+i+" id=item"+i+"></span></td>");}</script></td> </tr> </table> </td> </tr></table></body></html>Alica CWB
desculpe, na primeira resposta esqueci de explicar:
itens[1] = "item 1";
itens[2] = "item 2";
subitens[1] = "subitem 1 A|subitem 1 B";
subitens[2] = "subitem 2 A|subitem 2 B";cada ítem de subítem deve ser separado por um caracter identificador, no caso |
subitens[1] = "subitem 1 A**|**subitem 1 B";
subitens[2] = "subitem 2 A**|**subitem 2 B";veja como fica o seu script:
subitens[1] = "<a href=\"manut_categorias.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Categoria</a>| <a href=\"manut_menus.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Menu</a>| <a href=\"manut_groups.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Grupo</a>| <a href=\"manut_users.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">Usuário</a>";subitens[2] = "<a href=\"fornecedor.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Fornecedores</a>| <a href=\"departamento.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Departamentos</a>| <a href=\"disciplina.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Disciplinas</a>| <a href=\"tipo_documento.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Tipos de documentos</a>";subitens[3] = "<a href=\"cad_int_etapa_1.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Interno</a>| <a href=\"cad_ext_etapa_1.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Externo</a>| <a href=\"conjunto_etapa_1.php?sc=<?php echo $sc; ?>\" target=\"mainFrame\" class=\"decorlink\">• Conjunto</a>";troque apenas o trecho dos subitensblzinha ??Obrigada himon...
O problema ja foi resolvido... no html ficou assim...
<table width="962" border="0" cellpadding="0" cellspacing="0" bgcolor="#CC9933"> <tr> <td><table width="100%" border="0" cellpadding="0" cellspacing="0" class="textmenu"> <tr align="center"> <td width="18"><a href="index_intra.php?<?php echo "sc=$sc"; ?>" target="cont"><img src="../images/casa.gif" width="18" height="18" border="0" align="middle"></a></td> <td> <table border="0" cellspacing="1" cellpadding="0" width="100%" height="20" class="textmenu"> <tr align="center"> <script language="javascript"> for(i=1;i<itens.length;i++){ document.write("<td bgcolor=\"#FFFFFF\" onclick=\"javascript:style.background=\'#F5ECE2\'\"\"><a href=\"javascript:;\" onclick=\"teste("+i+");\"javascript:style.background=\'#F5ECE2\'\"\" class=\"textmenu\">"+itens[i]+"</a></td>"); } </script> </tr> </table> </td> </tr> <tr bgcolor="#FFFFFF"> <td width="18" bgcolor="#FFFFFF"> </td> <td> <table border="0" cellspacing="1" cellpadding="0" width="100%" class="textmenu"> <tr> <td height="15" bgcolor="#FFFFFF"> <script language="javascript"> for(i=1;i<itens.length;i++){ document.write("<font size=\"1\"><span name=item"+i+" id=item"+i+"></span></font>"); } </script> </td> </tr> </table> </td> </tr> </table></td> </tr></table>e no script, foi misturado php junto....
<script language="JavaScript" type="text/javascript">itens = new Array();subitens = new Array();<?php$agrupa_categoria = "";while ($linha_menu = mysql_fetch_array ($resultado_menus)) { if (ereg ("#$linha_menu[tb_menu_nome]#", "$lista_de_menus", $regs)) { if ($agrupa_categoria <> $linha_menu["tb_menu_id_categ"]){ $count++; $menus_montados = ""; $agrupa_categoria = $linha_menu["tb_menu_id_categ"];?> itens[<?php echo $count; ?>] = "<strong><?php echo $linha_menu[tb_categ_nome]; ?></strong>";<?php } $menus_montados .= " <a href=\\\"$linha_menu[tb_menu_link]?sc=$sc\\\" target=\\\"cont\\\" class=\\\"decorlink\\\">$linha_menu[tb_menu_nome]</a> "; }?> subitens[<?php echo $count; ?>] = "<?php echo $menus_montados; ?>";<?php} ?>aux = 0;function teste(n){ if(aux==n){ e = document.all["item"+n]; e.innerHTML = ""; aux = 0; }else{ if(aux!=0){ e = document.all["item"+aux]; e.innerHTML = ""; } aux = n; e = document.all["item"+n]; retornar = " "; vetor = subitens[n].split("|"); for(i=0;i<vetor.length;i++){ retornar += " <TR><TD> " + vetor[i] + " </TD> </tr>"; } e.innerHTML = retornar; }}</script>Levou o dia inteiro hj.... Mas pelo menos, nao da erro de script e funciona...
Obrigada por tudo...
Alica CWB
>
}
e.innerHTML = retornar;
}
}
for(i=1;i<itens.length;i++){
* document.write("<tr><td><a href=\"java script:;\" onclick=\"teste("+i+");\">"+itens**+"</a><span name=item"+i+" id=item"+i+"></span></td></tr>");*
}
</body></html>
*em azul onde você adiciona os itens e subitens**se por exemplo quiser o item 3 com 5 subitens adicione:*
itens[3] = "item 3";
subitens[3] = "subitem 3 A|subitem 3 B|subitem 3 C|subitem 3 D|subitem 3 E";