Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

filipescoob

Alterar de Javascript para Jquery

Por , em Javascript

Recommended Posts

filipescoob    1

filipescoob
Postado

Galera,

 

Criei esta função em javascript porem queria fazer algo melhor em jquery, alguem poderia me ajudar de por onde começar ?

 

A função ela esconde as linhas de uma tabela e ao clicar nas tds ele aparece uma linha com uma descrição sempre uma por vez.

 

Basicamente é um hidden/view

 

<script language="JavaScript" type="text/javascript">
function participante(id) {
	var tds = document.getElementsByTagName('tr');
	for (var i=0; i<tds.length; i++){
	  var link = tds[i];	  
	  var rel = link.getAttribute('id');
	  if ((rel.substring(0, 14)) && (rel.substring(0, 14)) == 'tdParticipante'){
		if (document.getElementById("tdParticipante"+rel.substring(14, 16)).style.display == ''){
			document.getElementById("cabParticipante"+rel.substring(14, 16)).className = 'participante p'+ rel.substring(14, 16) +' cursor';
		}
		link.style.display = 'none';
	  }

	  if ((rel.substring(0, 14)) && (rel.substring(0, 14)) == 'ddParticipante'){
		if (document.getElementById("tdParticipante"+rel.substring(14, 16)).style.display == ''){
			document.getElementById("cabParticipante"+rel.substring(14, 16)).className = 'participante p'+ rel.substring(14, 16) +' cursor';
		}
		link.style.display = 'none';
	  }
	}	

   document.getElementById("cabParticipante"+id).className = 'participante p'+id+' cursor selected';

	if(document.getElementById("tdParticipante"+id).style.display=="none"){
		document.getElementById("tdParticipante"+id).style.display="";
		}
			else {
			document.getElementById("tdParticipante"+id).style.display="none";
			}

	if(document.getElementById("ddParticipante"+id).style.display=="none"){
		document.getElementById("ddParticipante"+id).style.display="";
		}
			else {
			document.getElementById("ddParticipante"+id).style.display="none";
			}
}
</script>

 

 

Obrigado galera!!!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

mostre como é o html q esse código afeta.

Compartilhar este post

Link para o post
Compartilhar em outros sites

filipescoob    1

filipescoob
Postado

mostre como é o html q esse código afeta.

 

<style type="text/css">

.cabecalho
{
font-weight:bold;
vertical-align:middle; 
height:30px; 
padding-left:10px; 
font-family: Verdana, Geneva, sans-serif;
font-size:11px; 	
}
.faixas
{
font-weight:bold;
text-align:center;
vertical-align:middle; 
height:30px; 
font-family: Verdana, Geneva, sans-serif;
font-size:11px; 	

}
.participante
{
vertical-align:middle; 
padding-left:10px; 
font-family: Verdana, Geneva, sans-serif;
font-size:11px; 	
}
.participante : hover
{
border:1px #efefef;	
}
.f1
{
background-color:#e4f1fb;
}
.f2 {
background-color:#d7ebf9;
}
.p00 {font-size:10px; }
.p0 {font-size:11px; }
.p01 {text-align:center; background: #00FFFF;}
.selected { font-weight:bold; border:1px solid #000;}
.p02 {text-align:center; background: #00CC66;}
.p03 {text-align:center; background: #FFFF00;}
.p04 {text-align:center; background: #FF6600;}
.p05 {text-align:center; background: #FF99FF;}
.p06 {text-align:center; background: #66CCFF;}
.p07 {text-align:center; background: #33FF33;}
.p08 {text-align:center; background: #FF9933;}
.p09 {text-align:center; background: #FFCC66;}
.p10 {text-align:center; background: #33CCFF;}
.p11 {text-align:center; background: #FF6699;}
.p12 {text-align:center; background: #99CC99;}
.p13 {text-align:center; background: #CC6633;}
.p14 {text-align:center; background: #33CCCC;}
.p15 {text-align:center; background: #99FF33;}
.p16 {text-align:center; background: #FFCCFF;}
.p17 {text-align:center; background: #999933;}
.p18 {text-align:center; background: #FFCC99;}
.p19 {text-align:center; background: #CC99FF;}
.p20 {text-align:center; background: #99CCFF;}
.p21 {text-align:center; background: #66CC66;}
.p22 {text-align:center; background: #FFFF66;}
.p23 {text-align:center; background: #FF9966;}
.p24 {text-align:center; background: #CCCC33;}
.p25 {text-align:center; background: #CC66CC;}
.p26 {text-align:center; background: #0099CC;}
.p27 {text-align:center; background: #00CC00;}
.p28 {text-align:center; background: #CCFF00;}
.p29 {text-align:center; background: #FFFF99;}
.p30 {text-align:center; background: #CC99CC;}
.p31 {text-align:center; background: #6699CC;}
.p32 {text-align:center; background: #66CC00;}
.p33 {text-align:center; background: #FFFF33;}
.p34 {text-align:center; background: #FF9900;}
.p35 {text-align:center; background: #9966CC;}
.p36 {text-align:center; background: #99FFFF;}
.p37 {text-align:center; background: #CCFF33;}
.p38 {text-align:center; background: #FF99CC;}
.p39 {text-align:center; background: #6699FF;}
.p40 {text-align:center; background: #9966FF;}
.cursor { cursor:pointer; }
</style>
</style>

<body>
<table width="100%" border=1 class="ui-widget-content" cellspacing="0" cellpadding="0"> 
<tr>
 <td colspan="6" class="state-default ui-state-active cabecalho"><b>Mapa de investimento</b></td>
</tr>

<tr>
<td width="10%" class="ui-state-default cabecalho" style="border-right:0px;"><center>Faixa Inicial</center></td>
<td width="10%" class="ui-state-default cabecalho" style="border-left:0px;"><center>Faixa Final</center></td>
<td width="80%" class="ui-state-default cabecalho" style="border-left:0px;"><center>Participações e Modalidades</center></td>
</tr>

<tr>
 <td rowspan="2" width="3%" class="ui-state-default f1 faixas" style="border-right:0px; border-bottom:0px; border-top:0px;">0,00</td>
 <td rowspan="2" width="3%" class="ui-state-default f1 faixas" style="border-left:0px; border-bottom:0px; border-top:0px;">100.000,00</td>
 <td colspan="2" style="padding-top:1px;">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p01 cursor" width="15%" onClick="participante('01');" id="cabParticipante01">12,5% - Petro</td>
		<td class="participante p02 cursor" width="15%" onClick="participante('02');" id="cabParticipante02">12,5% - Petro</td>
		<td class="participante p03 cursor" width="25%" onClick="participante('03');" id="cabParticipante03">25% - Petro</td>
		<td class="participante p04 cursor" width="25%" onClick="participante('04');" id="cabParticipante04">25% - Petro</td>
		<td class="participante p05 cursor" width="25%" onClick="participante('05');" id="cabParticipante05">25% - Petro</td>
	</tr>
</table>
 </td>
</tr>
<tr>
<td>
	<table width="100%" cellspacing="1" cellpadding="0">
	  <tr height=15px;>
		<td class="participante p06 cursor" onClick="participante('06');" id="cabParticipante06">INVESTIMENTO - 1.000.000,00</td>
	  </tr>
	</table>
</td>
</tr>

<tr>
 <td width="3%" class="ui-state-default f2 faixas" style="border-right:0px; border-bottom:0px;">100.000,01</td>
 <td width="3%" class="ui-state-default f2 faixas" style="border-left:0px; border-bottom:0px;">200.000,00</td>
 <td colspan="2">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p07 cursor" width="25%" onClick="participante('07');" id="cabParticipante07">25% - Petro</td>
		<td class="participante p08 cursor" width="25%" onClick="participante('08');" id="cabParticipante08">25% - Petro</td>
		<td class="participante p09 cursor" colspan="3"width="50%" onClick="participante('09');" id="cabParticipante09">50% - ERRO</td>
	</tr>
</table>
 </td>
</tr>

 <tr>
 <td width="3%"  class="ui-state-default f1 faixas" style="border-right:0px; border-bottom:0px;">200.000,01</td>
 <td width="3%"  class="ui-state-default f1 faixas" style="border-left:0px; border-bottom:0px;">300.000,00</td>
  <td colspan="2">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p10 cursor" width="33%" onClick="participante(10);" id="cabParticipante10">33% - Petro</td>
		<td class="participante p11 cursor" width="33%" onClick="participante(11);" id="cabParticipante11">33% - Petro</td>
		<td class="participante p12 cursor" colspan="2" width="33%" onClick="participante(12);" id="cabParticipante12">33% - Petro</td>
	</tr>
</table>
 </td>
</tr>
<tr>
 <td width="3%" class="ui-state-default f2 faixas" style="border-right:0px; border-bottom:0px;">300.000,01</td>
 <td width="3%" class="ui-state-default f2 faixas" style="border-left:0px; border-bottom:0px;">400.000,00</td>
  <td colspan="2">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p13 cursor" width="30%" onClick="participante(13);" id="cabParticipante13">30% - ERRO</td>
		<td class="participante p14 cursor" width="16%" onClick="participante(14);" id="cabParticipante14">16% - ERRO<td>
		<td class="participante p15 cursor" colspan="2" width="54%" onClick="participante(15);" id="cabParticipante15">42% - ERRO</td>
	</tr>
</table>
 </td>
</tr>
<tr>
 <td width="3%" class="ui-state-default f1 faixas" style="border-right:0px; border-bottom:0px;">400.000,01</td>
 <td width="3%" class="ui-state-default f1 faixas" style="border-left:0px; border-bottom:0px;">500.000,00</td>
  <td colspan="2">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p16 cursor" colspan="2" onClick="participante(16);" id="cabParticipante16" width="50%">50% - ERRO</td>
		<td class="participante p17 cursor" colspan="2" onClick="participante(17);" id="cabParticipante17" width="50%">50% - ERRO</td>
	</tr>
</table>
 </td>
</tr>
 <tr>
 <td width="3%" class="ui-state-default f2 faixas" style="border-right:0px; border-bottom:0px;">500.000,01</td>
 <td width="3%" class="ui-state-default f2 faixas" style="border-left:0px; border-bottom:0px;">600.000,00</td>
   <td colspan="2">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p18 cursor" colspan="4" onClick="participante(18);" id="cabParticipante18">100% - ERRO</td>
	</tr>
</table>
 </td>
</tr>
<tr>
 <td width="3%" class="ui-state-default f1 faixas" style="border-right:0px; border-bottom:0px;">600.000,01</td>
 <td width="3%" class="ui-state-default f1 faixas" style="border-left:0px; border-bottom:0px;">700.000,00</td>
  <td colspan="2">
<table width="100%" cellspacing="1" cellpadding="0">
	<tr height="30px";>
		<td class="participante p19 cursor" colspan="4" onClick="participante(19);" id="cabParticipante19">100% - ERRO</td>
	</tr>
</table>
 </td>
</tr>
</table>

<table  width="100%" class="ui-widget-content" cellspacing="1" cellpadding="0">
 <tr height="30px";>
	<td colspan="2" class="state-default ui-state-active cabecalho"><b>Legenda</b></td>
 </tr>
<tr height="30px";>
	<td colspan="2" class="f1 participante"> Clique no mapa acima para ver o detalhe </td>	
</tr>
<tr height="30px" id="tdParticipante01" style="display:none;">
	<td style="width:3%;" height="20px" class="participante p01"> </td>
	<td class="f1 participante ui-state-default"> Participante 01</td>	
</tr>

<tr height="30px" id="ddParticipante01" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante02" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p02"> </td><td class="f2 participante ui-state-default"> Participante 02</td>	
</tr>

<tr height="30px" id="ddParticipante02" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>	

<tr height="30px" id="tdParticipante03" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p03"> </td><td class="f1 participante ui-state-default"> Participante 03</td>	
</tr>

<tr height="30px" id="ddParticipante03" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante04" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p04"> </td><td class="f2 participante ui-state-default"> Participante 04</td>	
</tr>

<tr height="30px" id="ddParticipante04" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GN:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante05" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p05"> </td><td class="f1 participante ui-state-default"> Participante 05</td>	
</tr>

<tr height="30px" id="ddParticipante05" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante06" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p06"> </td><td class="f2 participante ui-state-default"> Participante 06</td>	
</tr>

<tr height="30px" id="ddParticipante06" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">taxa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Tipo:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Quant.:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Valor:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Valor pago total:</td>
		<td class="participante">Sim</td>
	  </tr>

	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante07" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p07"> </td><td class="f1 participante ui-state-default"> Participante 07</td>	
</tr>

<tr height="30px" id="ddParticipante07" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante08" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p08"> </td><td class="f2 participante ui-state-default"> Participante 08</td>	
</tr>

<tr height="30px" id="ddParticipante08" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante09" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p09"> </td><td class="f1 participante ui-state-default"> Participante 09</td>	
</tr>

<tr height="30px" id="ddParticipante09" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante10" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p10"> </td><td class="f2 participante ui-state-default"> Participante 10</td>	
</tr>

<tr height="30px" id="ddParticipante10" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante11" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p11"> </td><td class="f1 participante ui-state-default"> Participante 11</td>	
</tr>

<tr height="30px" id="ddParticipante11" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante12" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p12"> </td><td class="f2 participante ui-state-default"> Participante 12</td>	
</tr>

<tr height="30px" id="ddParticipante12" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante13" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p13"> </td><td class="f1 participante ui-state-default"> Participante 13</td>	
</tr>

<tr height="30px" id="ddParticipante13" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante14" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p14"> </td><td class="f2 participante ui-state-default"> Participante 14</td>	
</tr>

<tr height="30px" id="ddParticipante14" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante15" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p15"> </td><td class="f1 participante ui-state-default"> Participante 15</td>	
</tr>

<tr height="30px" id="ddParticipante15" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante16" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p16"> </td><td class="f2 participante ui-state-default"> Participante 16</td>	
</tr>

<tr height="30px" id="ddParticipante16" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante17" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p17"> </td><td class="f1 participante ui-state-default"> Participante 17</td>	
</tr>

<tr height="30px" id="ddParticipante17" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante18" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p18"> </td><td class="f2 participante ui-state-default"> Participante 18</td>	
</tr>

<tr height="30px" id="ddParticipante18" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

<tr height="30px" id="tdParticipante19" style="display:none;">
	<td style="width:3%;" height="20px"  class="participante p19"> </td><td class="f1 participante ui-state-default"> Participante 19</td>	
</tr>

<tr height="30px" id="ddParticipante19" style="display:none;">
  <td colspan="2">
	<table>
	  <tr height="20px" >
		<td class="cabecalho">LMG Total:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão Faixa:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Comissão:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">GNPI:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Faixa:</td>
		<td class="participante">Sim</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Bonus:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Limitação:</td>
		<td class="participante">0,00</td>
	  </tr>
	  <tr height="20px" >
		<td class="cabecalho">Agencia:</td>
		<td class="participante">Sim</td>
	  </tr>
	</table>
  </td>
</tr>

</table>
</body>

 

William Bruno beleza!?

 

Conseguiu entender?

 

Alguem pode me ajudar?

 

Com jquery é bem mais simples, creio que nao precisa fazer o loop, mas nao tenho ideia de por onde começar, preciso apenas de uma luz de como fazer.

 

Obrigado

 

Galera,

 

Depois de todos estes dias consegui fazer funcionar, o problema é que não rola no IE apenas no Chrome e Firefox.

 

Alguém sabe o porque? Tentei com .hide() e .css() mas nenhum funciona no IE

 

$('table.interno tr td').click(function() {
  //alert('#tdparticipante'+this.id);
  $('#legenda .tdParticipante').css("display", "none");
  $('#legenda .ddParticipante').css("display", "none");

     $('#tdParticipante'+this.id).show();
  $('#ddParticipante'+this.id).slideDown("slow");
});

 

Lembro que esta dentro da chave

 

(function($) {
 $(document).ready(function() {

 

e que adicionai nas trs da legenda as classes .tdParticipante e .ddParticipante

 


.ddparticipante{ display:none;}
.tdparticipante{ display:none;}

<tr height="30px" id="tdParticipante01" class="tdparticipante">
        << conteúdo >>
<tr height="30px" id="ddParticipante01" class="ddparticipante">
        << conteúdo >>

 

Alguém sabe o porque não funciona no IE?

Compartilhar este post

Link para o post
Compartilhar em outros sites

filipescoob    1

filipescoob
Postado

Mário Monteiro, boa tarde,

 

Vi que editou o post, ficou organizado, porem desta maneira ficou ruim das pessoas me ajudarem, porque ajuntou uma solução (que esta no final) junto a uma duvida e um código gigante no inicio. Estou postando novamente abaixo, pois são assuntos distintos, o abaixo é uma solução que encontrei dias depois de postar a duvida porem ela não funciona no IE, onde a duvida mudou (funcionou não funcionando).

 

Obrigado

 

---------------------------------------------------------------

 

Galera,

 

Depois de todos estes dias consegui fazer funcionar, o problema é que não rola no IE apenas no Chrome e Firefox.

 

Alguém sabe o porque? Tentei com .hide() e .css() mas nenhum funciona no IE

 

       $('table.interno tr td').click(function() {
         //alert('#tdparticipante'+this.id);
         $('#legenda .tdParticipante').css("display", "none");
         $('#legenda .ddParticipante').css("display", "none");

     $('#tdParticipante'+this.id).show();
         $('#ddParticipante'+this.id).slideDown("slow");
       });

 

Lembro que esta dentro da chave

 

(function($) {
 $(document).ready(function() {

 

e que adicionai nas trs da legenda as classes .tdParticipante e .ddParticipante

 

.ddparticipante{ display:none;}
.tdparticipante{ display:none;}

       <tr height="30px" id="tdParticipante01" class="tdparticipante">
        << conteúdo >>
       <tr height="30px" id="ddParticipante01" class="ddparticipante">

 

 

Alguém sabe o porque não funciona no IE?

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito