Recursos css e javascript não funcionam com load do jquery

[lucianfpaula 0]

Olá como estão, eu estou com problema aparentemente básico mas não consigo resolver, eu carrego conteúdos para um div via .loa() com jquery mas os recursos de css e javascript não funcionam, as classes css não funcionam uso o seguinte código.

function telaPedido(){
    $("#conteudoPrincipal").val("")
    $("#conteudoPrincipal").load("telas/pedidos.html")
}

aparentemente me parece que o conteúdo deveria ser carregado junto com a página principal, visto que se eu colocar o conteúdo na pagina direto tudo funciona.

[BrunoBit 82]

Seu código ta normal, era pra funcionar.

Possíveis erros:

1. Problema de CORS.

2. Não ter chamado a função telaPedido().

3. Estar usando a versão slim do jquery, no qual não possui a função load().

4. Caminho "telas/pedidos.html" pode estar errado.

5. id #conteudoPrincipal pode não existir ou estar escrito errado na tag do elemento.

[lucianfpaula 0]

Tudo que foi citado funciona normal, ele carrega a tela e tal, mas alguns recursos do javascript não funcionam.

[Omar~ 87]

Em 28/11/2018 at 19:55, lucianfpaula disse:

Tudo que foi citado funciona normal, ele carrega a tela e tal, mas alguns recursos do javascript não funcionam.

 

Tente ver se algo não falta a carregar pelo load.

Abra o inspetor do navegador selecione a opção console depois marque as opções Xhr e Request

Então execute o load do jquery, (Nota!! Use o navegador Mozilla Firefox para esse processo)

 

Obs.: É comum browsers apresentarem erros e alertas quando usando jquery principalmente seu métodos de ajax que não são síncronos.

 

No mais acredito que deveriam funcionar, pois requisições assíncronas assim como funciona o ajax com jquery tornam a aplicação lenta pois todo o restante do carregamento é interrompido até que tudo que foi requisitado pelo ajax esteja totalmente carregado.

Então com certeza você deve ver uma alerta como esse:

Citar

XMLHttpRequest síncrono não deve ser usado na thread principal devido a seus efeitos prejudiciais para a experiência de usuário. Para mais informações http://xhr.spec.whatwg.org/

Ou seja é porque simplesmente atrapalha a interatividade do usuário com o website

 

Vale lembrar que todo carregamento de conteúdo, é salvo em cache pelo browser, se carregou esse arquivo sem os supostos recursos, pode ser que ele esteja salvo sem esses recursos e o browser não etá "consciente" que ele foi modificado e ele deve salvar outro.

Nesse caso pode ser solucionado simplesmente limpando os dados de navegação.

 

Como conselho sugiro somente usar ajax através do XMLHttpRequest nativo do browser.

[Douglas Julião 34]

quando você utiliza o load do jquery com um id o javascript é desativado para a página que você carrega, da uma olhada la na documentação do jquery.load.

Uma solução para isso é colocar os scripts que você quer que carregue depois do load em um callback:

$(document).ready(function(){
   $("#id").load("page.html #id",function(){
       //seus scripts aqui.
   });
});

da uma olhada aqui http://api.jquery.com/load/#script-execution

 

Provavelmente está acontecendo isso.