Ir para conteúdo

POWERED BY:

Arquivado

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

Pyetro

[Resolvido] Complexidade com InnerHTML e JS da pagina carregada&#

Por , em Javascript

Recommended Posts

Pyetro    0

Pyetro
Postado

Olá a todos primeiramente...

 

Venho lhes pedir ajuda, e também vou deixar alguns códigos meus aqui, pra ajudar quem precisar.

 

Bom, estou acordado desenvolvendo, pesquisando desde as 17h de ontem sem folga até agora 9:39, porém com muito sono, estou desistindo da pesquisa incessante de horas atrás de uma solução que ainda não achei, venho pedir socorro enquanto descanso pra próxima jornada.

 

Vamos lá, meu site é carregado no index.php, porém o conteúdo principal da página é carregado via Ajax (innerHTML) na div "content"...

 

Até então todos meus pequenos problemas haviam sido "fáceis" de se resolver até deparar-me com tal...

 

Fiz uma página de registro de usuário (dados_cadastro.php), nela tem funções javascript para autenticação dos dados... Funciona muito bem, então resolvi/precisei adicionar alguns campos que necessitam ser mascarados (CEP,Telefone,Celular)...

 

O código que eu fiz funciona também perfeitamente SE a página dados_cadastro.php é aberta diretamente no navegador, porém tendo sido carregado via ajax pra dentro da div content, esta função deixa de funcionar! Aí é que preciso da ajuda.

 

Os arquivos...

 

index.php

<?
header("Content-Type: text/html; charset=iso-8859-1", true);
require_once('../_ext/_requires/php_function.php');
session_start();

CheckUsers();

$login = base64_decode($_SESSION['cookie_login']);
$email = base64_decode($_SESSION['cookie_email']);

(strlen($login)== '') ? $dados_cad = 'registrar' : $dados_cad = 'membros';

$ContentMain = GetPost('ContentMain');
$Valor = GetPost('Valor');

$url = $_SERVER['PHP_SELF'];
$pgtltcolor = CheckTitlePageColor($url);
$PortalPage = CheckPortalPage($url);
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="pt-br">
<head>
<title> |   MuRainFall - The Best New Server   |  </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<link rel="stylesheet" type="text/css" href="../_ext/_css/_main/div.css">
<link rel="stylesheet" type="text/css" href="../_ext/_css/mupsh/div.css">

<?include("../_ext/_portal/hacks_ie.php");?>

<script type="text/javascript" src="../_ext/_js/script.js"></script>
<script type="text/javascript" src="../_ext/_js/ajax.js"></script>
<script type="text/javascript" src="../_ext/_js/reg.js"></script>
<script type="text/javascript" src="../_ext/_js/videos.js"></script>
<script type="text/javascript" src="../_ext/_js/events.js"></script>
</head>

<body onLoad="javascript:ContentBody('<?=$ContentMain; ?>','<?=$Valor; ?>','<?=$pgtltcolor;?>'); Events();">

   <div id="ALL" align="center">
     <div id="Main" align="center">

           <div class="spacer_up"><!-- Nada --></div>

           <div id="header" align="left">
             <div class="MainLink" onClick="location.href='./';"></div>
           </div><!-- Fim da  header-->

           <div class="spacer"><!-- Nada --></div>

             <div class="Rel">
               <div id="Abs000" onClick="location='../../'" onMouseOver="_FocusForIE(this,true,'');" onMouseOut="_FocusForIE(this,false,'');">Portal SH 
               </div>
               <div id="Abs001" onClick="ContentBody('<?=$dados_cad; ?>','<?=$PortalPage;?>','<?=$pgtltcolor;?>');" onMouseOver="_FocusForIE(this,true,'');" onMouseOut="_FocusForIE(this,false,'');"><?=ucwords($dados_cad);?>
               </div>
               <div id="Abs002" onClick="ContentBody('contatos','','<?=$pgtltcolor;?>');" onMouseOver="_FocusForIE(this,true,'');" onMouseOut="_FocusForIE(this,false,'');">Contato
               </div>

               <? if(strlen($login) == '') { ?>
               <div id="Abs005" align="right">
<form name="frm_idx" method="post" enctype="multipart/form-data" action="">
   <input type="hidden" id="logon" name="logon" value="<? if(strlen($login) == '') { ?>0<? } else { ?>1<? } ?>">
                   Login <input type="text"     size="12" maxlength="12" name="login_idx" id="login_idx" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
                   Senha <input type="password" size="12" maxlength="12" name="senha_idx" id="senha_idx" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
                      <input type="checkbox" name="check_idx" id="check_idx" title="SELECIONE PARA PERMANECER LOGADO!!!" class="checkbox">  
                   <input class="btn" id="send" type="button" name="send" value="Enviar" onClick="AjaxLogin();">
</form>
               </div>
               <? } else { ?>
               <div id="Abslogin_name" > <span style="color: #AAE; font: 12px Times New Roman, bold;">Bem vindo: </span> <?=$login; ?>
               </div>
               <div id="Abs006" onClick="ContentBody('altera_dados','<?=$PortalPage;?>','<?=$pgtltcolor;?>');" onMouseOver="_FocusForIE(this,true,'');" onMouseOut="_FocusForIE(this,false,'');">Meus Dados
               </div>
               <div id="Abs007" onClick="Logout('portal');" onMouseOver="_FocusForIE(this,true,'');" onMouseOut="_FocusForIE(this,false,'');">Sair
               </div>
               <? } ?>
               <div id="Abs_streak"><!-- NADA --></div>
             </div><!-- Fim da  Rel-->
           <div class="spacer"><!-- Nada --></div>
           <div id="content"><!-- Conteudo Principal --></div>
     </div><!-- Fim da  Main-->
     <div class="spacer_down"><!-- Nada --></div>
     <div class="clear"> </div>
     <div id="bottom" align="center">
           <div id="Abs_streak2"><!-- NADA --></div>
           <div id="bottom2">Desenvolvido por "Safe's House Telecomunicações © 2010".</div>
     </div><!-- Fim da bottom -->
     <div class="spacer_down2"><!-- Nada --></div>
   </div><!-- Fim da  ALL-->
</body>
</html>

 

Certo, agora o arquivo dados_cadastro.php

<? 
header("Content-Type: text/html; charset=iso-8859-1", true);
require('../_requires/php_function.php');
session_start();

CheckUsers();
$color = GetPost('color');
$redir = GetPost('redir');

$btnAcao = GetPost('btnAcao');
if(strlen($btnAcao) == '') { $btnAcao = $btnAcaoIndex; }

$var = GetPost('var');
if($var == 'altera_dados') {
   $titulo = 'Alterar dados';
   $text_conteudo = '  Altere seus dados caso seja necessário.<br> Mantenha os dados atualizados.';
} else if ($var == 'registrar') {
   $titulo = 'Registrar';
   $text_conteudo = '  Registre-se agora e tenha acesso a todo conteúdo do Portal SH...';
}

# recebe váriaveis
$login = base64_decode($_SESSION['cookie_login']);
$email = base64_decode($_SESSION['cookie_email']);

# Verifica se página tentou ser aberta fora do index e direciona pro index...
if(strlen($btnAcao) == ''){
   //echo "<script> self.location.href = 'index.php'; </script>";
} 

# Consulta dados no banco
if($var == 'altera_dados') {

   # Conexão com o Banco
   $dbsel='1';
   Conecta($dbsel);

   $sql = "SELECT  id          ,
                   login       ,
                   email       ,
                   nome        ,
                   sobrenome   ,
                   data_nasc   ,
                   cidade      ,
                   uf          ,
                   endereco    ,
                   numero      ,
                   complemento ,
                   cep         ,
                   telefone    ,
                   celular     ,
                   tipo
           FROM    users
           WHERE   login   = '".$login."'
                   ";

   # echo nl2br($sql); exit;
   $res = res($sql);
   echo $msg_erro = $res[1];
   $lines = FetchArray($res[0]);

       $user_id        = base64_encode($lines['id']);
       $login          = $lines['login'];
       $email          = $lines['email'];
       $nome           = $lines['nome'];
       $sobrenome      = $lines['sobrenome'];
       $data_dia       = substr($lines['data_nasc'],8,2);
       $data_mes       = substr($lines['data_nasc'],5,2);
       $data_ano       = substr($lines['data_nasc'],0,4);
       $cidade         = $lines['cidade'];
       $uf             = $lines['uf'];
       $endereco       = $lines['endereco'];
       $numero         = $lines['numero'];
       $complemento    = $lines['complemento'];
       $cep            = $lines['cep'];
       $telefone       = $lines['telefone'];
       $celular        = $lines['celular'];
       $tipo           = $lines['tipo'];
}

?>
<link rel="stylesheet" type="text/css" href="../_css/portal/div.css">
<script type="text/javascript" src="../_js/ajax.js"></script>
<script type="text/javascript" src="../_js/script.js"></script>
<script type="text/javascript" src="../_js/reg.js"></script>
<script type="text/javascript" src="../_js/events.js"></script>

<div id="in_content" align="center">
<form name="frm_dados" method="POST" type="multipart/form-data" >
   <input type="hidden" name="var_url" value="<?=$var;?>">
   <input type="hidden" name="btnAcao" value="">
   <input type="hidden" name="user_id" value="<?=$user_id;?>">

   <span style="font-size: 28px; color:#<?echo $color;?>;"><?=$titulo; ?></span>
   <p style="font: 14px Arial, Verdana; color: #FFF;"align="center">
   <?=$text_conteudo; ?>
   </p>

<table width="800" cellpadding="10" cellspacing="0" bgcolor="#141414">
 <tr>
  <td align="left">

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
       <td width="180">Login <? if($var == 'registrar') { ?>(4~12)<? } ?></td>
       <td><!-- nada --></td>
       <td><!-- nada --></td>
       <td width="35%" rowspan="2"> <? if($var == 'registrar') { ?>Digite o seu login contendo de 4 à 12 caratecres.<? } ?> <!-- NADA --></td>
     </tr>
     <tr>
       <td><input type="text"      name="login"    value="<? if($var == 'altera_dados') echo $login; ?>" size="16" maxlength="12" onFocus="_Focus(this,true);" onBlur="_Focus(this,false); _ValidaLogin(this.value);" <? if($var != 'registrar') { ?> readonly <? } ?> ></td>
       <td width="50" id="login_tf"><!-- nada --></td>
       <td id="msg_erro"><!-- nada --></td>
     </tr>
     <tr>
       <td>Email</td>
       <td><!-- nada --></td>
       <td width="32%" ><? if($var == 'registrar') { ?>Confirma-Email<? } ?><!-- NADA --></td>
       <td rowspan="2"> Digite seu Email, necessário para recuperar senha.</td>
     </tr>
     <tr>
       <td><input type="text"      name="email"    value="<? if($var == 'altera_dados') echo $email; ?>" size="32" maxlength="40" onFocus="_Focus(this,true);" onBlur="_Focus(this,false); _ValidaEmail(this.value);" <? if($var != 'registrar') { ?> readonly <? } ?>></td>
       <td id="email_tf"><!-- nada --></td>
       <td>

           <input type="<? if($var == 'registrar') { ?>text<? } else { ?>hidden<? } ?>"      name="email2"   value="<? if($var == 'altera_dados') echo $email; ?>" size="32" maxlength="40" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
           <? if($var != 'registrar') { ?>
           <input type="button" alt="nosubmit" class="btn" name="TrocaEmail" id="TrocaEmail" value="Trocar Email" onClick="javascript:_TrocaEmail('../_ext/_portal/troca_email.php','<?echo $user_id;?>');">
           <? }?>
       </td>
     </tr>
   </table>

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
     <? if($var == 'registrar') { ?>
       <td>Senha (4~16)</td>
       <td width="32%" >Confirma-Senha</td>
       <td width="35%" rowspan="2"> Digite sua senha contendo de 4 à 16 caracteres. Use Letras e Números para aumentar a segurança de sua conta. </td>
     </tr>
     <tr>
       <td><input type="password"  name="senha"    size="16" maxlength="16" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td><input type="password"  name="resenha"  size="16" maxlength="16" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
     </tr>
     <? } else if ($var == 'altera_dados') { ?>
     <tr>
       <td><input type="button" alt="nosubmit" class="btn" name="TrocaSenha" id="TrocaSenha" value="Trocar Senha" onClick="javascript:_TrocaSenha('../_ext/_portal/troca_senha.php','<?echo $user_id;?>');"></td>
       <td> Clique neste botão para mudar sua senha.</td>
     </tr>
     <? }?>
   </table>

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
     <? if($var == 'registrar') { ?>
       <td>Pergunta Secreta (4~16)</td>
       <td width="32%" >Resposta Secreta</td>
       <td width="35%" rowspan="2"> Escolha bem sua pergunta e resposta secreta pois só com eles conseguirá recuperar a senha. </td>
     </tr>
     <tr>
       <td><input type="text"  name="p_secreta"    size="16" maxlength="16" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td><input type="text"  name="r_secreta"    size="16" maxlength="16" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
     </tr>
     <? } else if ($var == 'altera_dados') { ?>
     <tr>
       <td><input type="button" alt="nosubmit" class="btn" name="TrocaRsecreta" id="TrocaRsecreta" value="Trocar RespostaSsecreta" onClick="javascript:_TrocaSecreta('../_ext/_portal/troca_secreta.php','<?echo $user_id;?>');"></td>
       <td> Clique neste botão para mudar sua Resposta secreta.</td>
     </tr>
     <? }?>
   </table>

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
       <td>Nome</td>
       <td>Sobrenome</td>
       <td>Data de Nascimento</td>
     </tr>
     <tr>
       <td><input type="text" name="nome"  value="<? if($var == 'altera_dados') echo $nome;?>" size="30" maxlength="200" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td><input type="text" name="sobrenome"  value="<? if($var == 'altera_dados') echo $sobrenome;?>" size="60" maxlength="200" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td>
           <select name="data_dia" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
           <option value=''></option>
           <? foreach($cfg_dia as $key => $val ){ ?>
               <option value="<?=$key;?>" <? if($key == $data_dia) echo 'selected'; ?>><?=$val;?></option>
           <? } ?>
           </select>
           <select name="data_mes" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
           <option value=''></option>
           <? foreach($cfg_mes as $key => $val ){ ?>
               <option value="<?=$key; ?>" <? if($key == $data_mes) echo 'selected'; ?>><?=$val;?></option>
           <? } ?>
           </select>
           <select name="data_ano" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
           <option value=''></option>
           <? foreach($cfg_ano as $key => $val ){ ?>
               <option value="<?=$key; ?>" <? if($key == $data_ano) echo 'selected'; ?>><?=$val;?></option>
           <? } ?>
           </select>
       </td>
     </tr>
   </table>

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
       <td>Endereço</td>
       <td>Número</td>
       <td>Complemento</td>
     <tr>
     </tr>
       <td><input type="text" name="endereco"     value="<? if($var == 'altera_dados') echo $endereco;?>"     size="60" maxlength="120" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td><input type="text" name="numero"       value="<? if($var == 'altera_dados') echo $numero;?>"       size="10" maxlength="20" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td><input type="text" name="complemento"  value="<? if($var == 'altera_dados') echo $complemento;?>"  size="10" maxlength="20" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
     </tr>
     <tr>
       <td>Cidade</td>
       <td>Estado</td>
       <td>CEP</td>
     </tr>
     <tr>
       <td><input type="text" name="cidade" value="<? if($var == 'altera_dados') echo $cidade;?>" size="60" maxlength="120" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td>
           <select name="uf" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);">
           <? foreach($cfg_uf as $key => $val ){ ?>
               <option value="<?=$key; ?>" <? if($key == $uf) echo 'selected'; ?>><?=$val;?></option>
           <? } ?>
           </select>
       </td>
       <td><input type="text" name="cep" value="<? if($var == 'altera_dados') echo $cep;?>" size="10" maxlength="9" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
     </tr>
   </table>

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
       <td>Telefone</td>
       <td width="32%" >Celular</td>
       <td width="35%" rowspan="2"> Digite telefone e celular. </td>
     </tr>
     <tr>
       <td><input type="text"  name="telefone"    value="<? if($var == 'altera_dados') echo $telefone;?>" size="16" maxlength="14" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
       <td><input type="text"  name="celular"     value="<? if($var == 'altera_dados') echo $celular;?>"  size="16" maxlength="14" onFocus="_Focus(this,true);" onBlur="_Focus(this,false);"></td>
     </tr>
   </table>

   <table border="0" cellpadding="3" cellspacing="0" class="TableReg">
     <tr>
       <td align="center">
       <input type="button" class="btn" alt="nosubmit" name="enviar" id="enviar" value="Enviar" onClick="javascript:_ChamaValida('<?echo $redir;?>');">
       </td>
     </tr>
   </table>



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

</form>
</br></br></br></br></br>
</div>

<script>
f = document.forms['frm_dados'];

MaskInput(f.cep,        '?????-???');
MaskInput(f.telefone,   '(??) ????-????');
MaskInput(f.celular,    '(??) ????-????');

</script>

 

Arquivos JS, script.js (Ajax)

/*
* getHTTPObject
*/
function getHTTPObject()
{
   var xmlhttp;
   try
   {
       xmlhttp = new XMLHttpRequest(); // XMLHttpRequest para browsers como: Firefox, Safari entre outros.
   }catch(ee){
       try
       {
           xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); // Para o IE da MS
       }catch(e){
           try
           {
               xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); // Para o IE da MS
           }catch(E){
               xmlhttp = false;
           }
       }
   }
   return xmlhttp;
}

// Definindo varáveil http
var http = new Array();

// Função para iniciar carregamento do site
function ContentBody (valor, valor2, valor3){

   var data       = new Date();
   var parametros = "";
   var url        = "";

   switch(valor){
       case 'videos':
           url = 'videos.php'+valor2;
           break;
       case 'imagens':
           url = 'imagens.php?color='+valor3;
           break;
       case 'registrar':
           url = '../../_ext/_portal/dados_cadastro.php?var='+valor+'&redir='+valor2+'&color='+valor3;
           break;
       case 'membros':
           url = '../../_ext/_portal/membros.php?filter='+valor2+'&color='+valor3;
           break;
       case 'contatos':
           url = '../../_ext/_portal/contatos.php?color='+valor3;
           break;
       case 'altera_dados':
           url = '../../_ext/_portal/dados_cadastro.php?var='+valor+'&redir='+valor2+'&color='+valor3;
           break;
       default:
           url = 'main_index.php?color='+valor3+valor2;
           break;
   }

http[data]     = getHTTPObject();   // armazenando o objeto!
http[data].open("POST",url,true);
   //window.open(url);
http[data].setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http[data].setRequestHeader("CharSet", "ISO-8859-15");
http[data].setRequestHeader("Content-length", url.length);
http[data].setRequestHeader("Connection", "close");

http[data].onreadystatechange = function () {
       if (http[data].readyState == 4) {
           if (http[data].status == 200) {
               document.getElementById("content").innerHTML = http[data].responseText;

           }
       }
   };
http[data].send(parametros);
}

function Trim(str){
   return str.replace(/^\s+|\s+$/g,"");
}

function _Focus(obj,val) {
   if(val == true) {
       obj.className = 'focado';
   } else {
       obj.className = '';
   }
}

function _FocusForIE(obj,val,bg) {
   // Apenas para o MS IE
   if(navigator.appName === 'Microsoft Internet Explorer') {
       if(val == true) {
           obj.style.color = '#222';
           obj.style.border = '1px inset #333';
           obj.style.backgroundColor = '#FFF';
       } else {
           obj.style.color = '#FFF';
           obj.style.border = '1px outset #FFF';
           obj.style.backgroundColor = bg;
       }
   }
}

/*-------------------------------------------------------------------
# Função para criar janelas popup
action 1 = retorna os parametros da jenla
action 2 = abre janela sem retornar param
--------------------------------------------------------------------*/
function Janela (action,url,title,_wdt,_hgt,scroll,status,_location,resizable) {

   param = 'channelmode=0, fullscreen=0, directiores=0, tollbar=0, menubar=0,titlebar=1';
   param += ', scrollbars='+scroll;
   param += ', status='+status;
   param += ', location='+_location;
   param += ', resizable='+resizable;
   param += ', width='+_wdt;
   param += ', height='+_hgt;

   //alert(screen.width+' '+window.innerWidth+' '+screen.height+' '+window.innerHeight);

   left = (screen.width - _wdt) / 2;
   top = (screen.height - _hgt) / 2;

   param += ', left='+left;
   param += ', top='+top;

   if(action == 1) {
       return ret = [url,param];
   }
   if(action == 2) {
       //alert(param);
       window.open(url,title,param);
   }
}

function _TrocaSenha(url,user_id) {
   NewWindow = Janela(1,url+'?user_id='+user_id,'','400','240',0,0,0,0);
   //alert(NewWindow[0]+' //n '+NewWindow[1]);
   NewWindow = window.open(NewWindow[0],'TrocaSenha',NewWindow[1]);
   NewWindow.focus();
}

function _TrocaEmail(url,user_id) {
   NewWindow = Janela(1,url+'?user_id='+user_id,'','500','240',0,0,0,0);
   //alert(NewWindow[0]+' //n '+NewWindow[1]);
   NewWindow = window.open(NewWindow[0],'Email',NewWindow[1]);
   NewWindow.focus();
}

 

arquivo events.js (nesse arquivo tem 3 funções interessantes que comento logo abaixo).

function Events () {
   /* ------------------------------------------------ */
   //   ADD EVENT LISTENER !!!
   /* ------------------------------------------------ */
   if (window.addEventListener || window.attachEvent){
       (
           function() {
               function handler(e) {
                   _el = e.target;
                   NextElement(e,_el);
               }
               function ev(e) {
                   _el = e.srcElement;
                   NextElement(e,_el);
               }
               if (window.addEventListener) {
                   document.addEventListener("keydown",handler,false);
               } else if (window.attachEvent) {
                   document.attachEvent("onkeydown",ev);
               }
           }
       ) ();
   } //End.
}

function NextElement(e,_el) {

   //_el = e.target;
   _elSearch = new Array();
   _Find = _elFind = '';

   if(e.keyCode == 13 && _el.getAttribute('type') != 'button' && (_el.tagName == 'INPUT' || _el.tagName == 'SELECT')) {

       for(i=0; _elSearch = document.getElementsByTagName("*"), i<_elSearch.length ;i++) {
           _elFind = _elSearch[i];
          if(_elFind.getAttribute('name') == _el.getAttribute('name') && _elFind.getAttribute('type') != 'button') {
              _Num = i;
              //alert(_elFind.getAttribute('type')+'  --  '+_elFind.getAttribute('name')+'  --  '+i);
              break;
          }
       }

       // Para pular o botão sem que, ele sendo o próximo, seja submetido. Indique o atributo alt nele com valor "nosubmit"
       for(i=_Num; _elSearch = document.getElementsByTagName("*"), i<_elSearch.length ;i++) {
           _elFind = _elSearch[i];
          if(_elFind.getAttribute('type') == 'button' && _elFind.getAttribute('alt') != 'nosubmit') {
              _Find = _elFind;
              //alert(_elFind.getAttribute('type')+'  --  '+_elFind.getAttribute('name')+'  --  '+i);
              break;
          }
       }
       //alert(_Find.getAttribute('name'));
       _Find.focus();
       _Find.submit();
   }
}

function MaskInput(el,mask){
   if (document.addEventListener || document.attachEvent){
       (function(){

           function FormatarCampo(e) {
               var key;
               if(e.keyCode)       key =  e.keyCode;
               else if(e.which)    key =  e.which;
               else if(e.charCode) key =  e.charCode;

                string = el.value;  
                i = string.length;

               if (i < mask.length) {
                   if (mask.charAt(i) == '?') {
                       return (key > 47 && key < 58);
                   } else {
                       if (mask.charAt(i) == '!') {  return (key > 64 && key < 91 && key > 96 && key < 123);  }
                       for (c = i; c < mask.length; c++) {
                           if (mask.charAt(c) != '?' && mask.charAt(c) != '!')
                               el.value = el.value + mask.charAt(c);
                           else if (mask.charAt(c) == '!'){
                               return (key > 64 && key < 91 && key > 96 && key < 123);
                           } else {
                               return (key > 47 && key < 58);
                           }
                       }
                   }
               } else return false;
           }

           if (el.addEventListener) {
               el.addEventListener("keydown",FormatarCampo,false);
           } else if (el.attachEvent) {
               el.attachEvent("onkeydown",FormatarCampo);
           }

       } ) ();
   } //End.
}

 

Bom, lendo o index.php o único botão usado para logar não tem 'Action' definido pois usa o 'onClick', eu gosto de após acabar de digitar a senha clicar "Enter" e ser redirecionado. Porém nesse código, ao apertar enter apenas nada fazia, então adicionei esse Events.js usando EventListener/Handlers para achar o elemento button logo depois do input que estava focado e dar o submit sem ter de clicar com o mouse, para achar o elemento atual e o button usei a função NextElement que eu criei, porém pesquisei mt para conseguir finalizar...

 

Outra função interessante e que é a do problema neste arquivo é o MaskInput (que muitos vão começar usar ^^ agora), ela por si é funcional, só da problema ao tentar ser iniciada no arquivo 'parent'(index.php), que na verdade não inicia a função.

 

Pois essa função como podem ver nos arquivos events.js e dados_cadastro.php fiz dela uma fácil maneira de ser chamada e organizada e muito funcional, usando o eventListener que adiciona pro documento esse evento sempre que uma tecla é pressionada (KeyPress ativa a função antes do dado ser inserido no input, enquanto KeyDown ativa a função depois), podendo tb adicionar o evento sobre os inputs "element.addEventListener", o principal dessa função (criar a mascara) que fica no intervalo do "if( i < mask.length) {"... "}" eu achei pesquisando e alterei a verificação de "!" para aceitar só letras invés de qualquer caractere, como era o original.

 

Bom, estou digitando aqui a 50 min hehehe... espero que alguém tenha entendido e possa me ajudar...

 

Vou deixar os links do meu site (ainda On se ng em casa desligar o PC server rsrsrs).

 

Link principal -> http://safeshouse.sytes.net:8080/portal

 

Link página de registros usando innerHTML -> http://safeshouse.sytes.net:8080/portal/?ContentMain=registrar

 

Link direto pro arquivos dados_cadastro (script events-MaskInput funcionando) -> http://safeshouse.sytes.net:8080/_ext/_portal/dados_cadastro.php

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

sim, exatamente.

 

javascript carregado com ajax não funciona:

http://forum.imasters.com.br/topic/264642-executar-funcoes-js-em-paginas-carregadas-com-ajax/

 

e os teus elementos trazidos com ajax, não existiam no instante do window.onload, portanto, ainda não tem as funções atreladas a eles.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Pyetro    0

Pyetro
Postado

Olá amigos, gostaria de agradecer aos que pensaram em ajudar e não viram solução ^^ e dizer ao amigo bruno aqui em cimaque pra tudo tem solução!!!

rsrsrs

 

Consegui duas soluções numa p**** só!!! Vamos lá, vou explicar... acompanhem a seguinte situação:

 

principal.html (arquivo que vai chamar o Ajax)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<div id = "teste">
</div>
<script src="ajax_magico.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!-- Botão que irá chamar a função AJAX -->
<input type="button" value="Gerar" onClick="Geral()" />
<!-- Fim -->
<div id = "resp">
</div>  
</body>
</html>

 

geral.html (arquivo chamado pelo Ajax)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<body>
<!-- Aki está a resposta da nossa página -->
Teste do DarkDemo para funções JS em páginas carregadas por Ajax...<br>
<input type="button" onClick="ola()" id = "botao" value = "Click Me">
</body>
<!-- Fim da resposta -->

<!-- E aki, é a função ola(), em JavaScript que será executada na página, quando ela for carregada -->
<script>
function ola() {
   alert('Ola Mundo! Isso é um teste de como fazer suas funções JS funcionarem em páginas trazidas pelo ajax....');
   document.getElementById("botao").value = "DarkDemo!";
}
ola();
</script>
<!-- Fim -->
</html>

 

ajax_magico.js (script Mágico realmente =D~~ )

// Faz o envio da página solicitada na função Geral()
var xmlHttp
function Geral() { 
   xmlHttp=GetXmlHttpObject();
   var url="Geral.php";
   xmlHttp.onreadystatechange=stateChanged;
   xmlHttp.open("GET",url,true);
   xmlHttp.send(null);
}

function stateChanged() { 
   if (xmlHttp.readyState==4) { 
       document.getElementById("resp").innerHTML=xmlHttp.responseText;
       texto = unescape(xmlHttp.responseText.replace(/\+/g," "));
       extraiScript(texto);
   }
}

function extraiScript(texto){
   var ini = 0;
   while (ini!=-1){
       ini = texto.indexOf('<script', ini);
       if (ini >=0){
           ini = texto.indexOf('>', ini) + 1;
           var fim = texto.indexOf('</script>', ini);
           codigo = texto.substring(ini,fim);
           eval(codigo);
           newTag(codigo);
       }
   }
}

// A função MAGICA, heheheh
function newTag(codigo) {
       var conteudo = document.getElementById("teste");
       var newElement = document.createElement("script");
       newElement.appendChild(document.createTextNode(codigo));
       conteudo.appendChild(newElement);
}

function GetXmlHttpObject() {
   var xmlHttp=null;
   try {
       xmlHttp=new XMLHttpRequest();
   }
   catch (e) {
       try {
           xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
       }
       catch (e) {
           xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
   }
   return xmlHttp;
}

 

Bom amigos mais doque eu falar aqui basta copiarem o código e executarem (nem precisa ter servidor web basta salvar como .html e .js).

 

Porém vou dizer, isso foi incrível...

 

Agora aquele meu código lá de cima executa perfeitamente mesmo sendo chamado pelo Ajax.

 

Bom, um ditado se faz verdade... "de grão em grão a galinha enche o papo". Tive que buscar e pesquisar muito, e achei vários scripts na internet e todos só davam pau! Nenhuma funcionava, aí fiz oque as galinhas fazem, vão de grão em grão, então puxei um pouquinho daqui, dali, de lá, de vários códigos aproveitei o melhor de cada um e juntei num só!

 

Esse script que fiz "ajax_magico.js" veio de dois scripts encontrados nesses tópicos:

 

http://forum.imasters.com.br/topic/264642-executar-funcoes-js-em-paginas-carregadas-com-ajax/

http://forum.imasters.com.br/topic/165277-ajax-executando-scripts-dentro-de-uma-pagina-carregada-com-ajax/page__gopid__547500

 

O primeiro não dava certo por vários erros no código original...

O segundo dava quase totalmente certo. Pois usando o código do primeiro (que chamava uma função ao clicar no botão) esse não funcionava, então juntei e arrumei os dois códigos e os dois agora apenas 1 ficaram 100%...

 

Qualquer dúvida só mandarem aí... Abraços

 

Abaixo vou, para estudo, à quem tiver interesse, postar os códigos que criei pro meu site!!!

Façam como eu, estudem o código e tirem aquilo que for de melhor proveito para vocês!!!

 

 

!!!!!!!!!!!!!!!EDITADO !!!!!!!!!!!!!!!

 

 

Hahahaha, falta de leitura é embaçado...

 

Eu fiz esse código final e tal, mas voltando a ver os tópicos vi que já tinha pronto!!! Só tinha faltado ler mais as respostas dos outros tópicos... rsrs!!!

 

De qlq forma, está tudo certo!!! vlw ;D

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