Ir para conteúdo
Fórum Script Brasil
  • 0

(Resolvido)JavaScript não pega foco de tag select no Firefox

Paulada

Perguntado por Paulada,

 Share

Pergunta

Paulada

Paulada

Postado
Postado (editado)

OLa a todos!

Boa tarde

Já que me tornei um estudante de JavaScript, tenho postado constantemente para resolver algumas dúvidas do que estou aprendendo e por isso estou voltando a postar hoje.

O programa é bem simples(espero que o problema também seja :blush: ). Tenho uma página em html que contém apenas uma tag select de estados do Brasil e que, quando clico em um deles é mostrado para mim um valor de moeda logo à direita. O meu problema é que a função funciona normalmente no Intenet Explorer, mas quando eu executo a página no Firefox, tenho sempre de apertar depois a tecla TAB, para aí sim serem mostrados os valores referentes a cada estado. Mesmo eu clicando nos nomes dos estados, não rola, só depois de pressionar TAB.

Tenho 2 arquivos em javascript, 1 em html e 1 em php. Imagino que a função responsável para buscar o valor(value) do campo select do html esteja no arquivo exemplo9.js, linha 3, que se não me engano deve ser a função getElementById.

O que fazer para que o Firefox redirecione o seu foco para dentro do select logo na primeira execução da página?

exemplo9.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRansitional//EN"
"http://www.w3.org/TR/html14/loose.dtd">

<html>

    <head>
        <title>Web Interativa com Ajax</title>

        &lt;script type="text/javascript" src="bibliotecaAjax.js"></script>
        &lt;script type="text/javascript" src="exemplo9.js"></script>

        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">    

    </head>

    <body>

        <h2 align="center">Formulário de compra</h2>
        <form action="java script:void%200">

            <p align="center">
                Estado:
            </p>
            <select name="estado" id="estado" size="1">
                <option value="">Escolha aqui</option>
                <option value="AC">Acre</option>
                <option value="AL">Alagoas</option>
                <option value="AM">Amazonas</option>
                <option value="AP">Amapá</option>
                <option value="BA">Bahia</option>
                <option value="CE">CE</option>
                <option value="DF">Distrito Federal</option>
                <option value="ES">Espírito Santo</option>
                <option value="GO">Goiás</option>
                <option value="MA">Maranhão</option>
                <option value="PA">Pará</option>
                <option value="PB">Paraíba</option>
                <option value="PE">Pernambuco</option>
                <option value="PI">Piauí</option>
                <option value="PR">Paraná</option>
                <option value="RJ">Rio de Janeiro</option>
                <option value="RN">Rio Grande do Norte</option>
                <option value="RO">Rondônia</option>
                <option value="RR">Roraima</option>
                <option value="RS">Rio Grande do Sul</option>
                <option value="SC">Santa Catarina</option>
                <option value="SE">Sergipe</option>
                <option value="SP">São Paulo</option>
                <option value="TO">Tocantins</option>
            </select>
            
            <span id="frete"></span>
            
        </form>

    </body>

</html>
exemplo9.js 
window.onblur = function()
{
    var estado = document.getElementById("estado");
    estado.onchange = function()
    {
        exibeFrete(estado);
    }
}

function exibeFrete(estado)
{
    if(estado == null)
    {
        return;
    }
    
    selecionado = estado.options[estado.selectedIndex].value;
    var url="exemplo9.php?estado="+encodeURIComponent(selecionado);
    requisicaoHTTP("GET",url,true);
}

function trataDados()
{
    var info = ajax.responseText; //  obtém a resposta como string
    var resposta = document.getElementById("frete");
    resposta.innerHTML = info;
}
bibliotecaAjax.js 
var ajax;
var dadosUsuario;


//------------- cria o objeto e faz a requisição ------------
function requisicaoHTTP(tipo,url,assinc)
{
    if(window.XMLHttpRequest)
    {
        ajax = new XMLHttpRequest();    // Mozilla, Safari,...
    }
    else
        if(window.ActiveXObject)    //IE
        {
            ajax = new ActiveXObject("Msxml2.XMLHTTP");

            if(!ajax)
            {
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            }
        }

    if(ajax) // iniciou com sucesso
    {
        iniciaRequisicao(tipo,url,assinc);
    }
    else
    {
        alert("Seu navegador não pussui suporte a essa aplicação!");
    }
}

//------------- Inicializa o objeto criado e envia os dados (se existirem) -----
function iniciaRequisicao(tipo,url,bool)
{
    ajax.onreadystatechange = trataResposta;
    ajax.open(tipo,url,bool);
    if(window.XMLHttpRequest)
    {
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");
        ajax.overrideMimeType("text/XML");    /* usado somente no Mozilla */
    }
    else
    {
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");
    }
    ajax.send(dadosUsuario);
}

// ------------ Inicia requisição com envio de dados -------------
function enviaDados(url)
{
    criaQueryString();
    requisicaoHTTP("POST",url,true);
}

// ------------ Cria a string a ser enviada, formato campo1 = valor1&campo2=valor2... -------
function criaQueryString()
{
    dadosUsuario="";
    var frm = document.forms[0];
    var numElementos = frm.elements.length;

    for(var i = 0; i < numElementos; i++)
    {
        if(i < numElementos-1)
        {
            dadosUsuario += frm.elements[i].name+"=" + encodeURIComponent(frm.elements[i].value)+"&";
        }
        else
        {
            dadosUsuario += frm.elements[i].name+"=" + encodeURIComponent(frm.elements[i].value);
        }
    }
}

// ------------ Trata a resposta do servidor ---------------
function trataResposta()
{
    if(ajax.readyState == 4)
    {
        if(ajax.status == 200)
        {
            trataDados();   // criar essa função no seu programa
        }
        else
        {
            alert("Problema na comunicação com o objeto XMLHttpRequest");
        }
    }
}
exemplo9.php 
<?php

    $gmtDate = gmdate("D, d M Y H:i:s");
    header("Expires: {$gmtDate} GMT");
    header("Last-Modified: {$gmtDate} GMT");
    header("Cache-Control: no-cache, must-revalidate");
    header("Pragma: no-cache");
    header("Content-Type: text/html; charset=ISO-8859-1");

    //  array de preços de Frete
    
    $frete = array
    (
        "AC" => "15,00", "AL" => "14,00",
        "AM" => "14,00", "AP" => "14,00",
        "BA" => "13,00", "CE" => "13,00",
        "DF" => "11,00", "ES" => "11,00",
        "GO" => "10,00", "MA" => "13,00",
        "MG" => "9,00",  "MS" => "14,00",
        "MT" => "12,00", "PA" => "15,00",
        "PB" => "14,00", "PE" => "14,50",
        "PI" => "15,00", "PR" => "9,00",
        "RJ" => "9,00",  "RN" => "15,00",
        "RO" => "15,00", "RR" => "15,00",
        "RS" => "9,50",  "SC" => "9,00",
        "SE" => "14,50", "SP" => "7,00",
        "TO" => "13,00"
    );
    
    $estado = $_GET["estado"];
    if(isset($frete[$estado]))
    {
        echo "O valor do frete é R\$".$frete[$estado];
    }
?>

:blink:

Editado por Paulada
Link para o comentário
Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...