0

Estou com esse javascript, e quero fazer que ao invés de abrir uma nova janela, ele abra um iframe.


 window.self.name = "emanager";
 function MostraBarra(){
 if (document.incluir.balancete_arquivo.value != ""){
 window.open('<%=BARRASTATUS%>','upload','width=400,height=150');
 }
 return true;
 }
7
  • 1
    A pergunta não está clara porque um iframe pode ser inserido em qualquer lugar da página.
    – Meu ovo
    16/07/2018 às 22:50
  • Então, não importa o lugar dá página, eu quero somente que ao invés dessa chamada window.open('<%=BARRASTATUS%>','upload','width=400,height=150');, seja puxando um iframe, assim talvez upload.html 16/07/2018 às 23:01
  • Mas um iframe é uma tag HTML que deve ser inserida na página. Onde?!
    – Meu ovo
    16/07/2018 às 23:02
  • Na mesma página da chamada o script. 16/07/2018 às 23:07
  • Isso eu sei amigo. Mas onde na página? No ínício, no final, oculto, tipo uma modal, no meio, após algum elemento específico etc etc... é isso que tá vago na pergunta.
    – Meu ovo
    16/07/2018 às 23:13

3 Respostas 3

1

Um iframe não é algo que "se abra" da mesma forma que se abre uma janela. Ele é uma tag HTML que você insere na página e carrega uma outra página.

O que você pode fazer é inserir a tag onde você deseja na página sem especificar uma URL e de forma oculta com display: none;:

<iframe style="display: none;"></iframe>

Na função você altera a visibilidade do iframe e define um src que será a página a ser carregada:

function MostraBarra(){
   if (document.incluir.balancete_arquivo.value != ""){
//      window.open('<%=BARRASTATUS%>','upload','width=400,height=150');
      var iframe = document.querySelector("iframe"); // seleciona o iframe pela tag
      iframe.style.display = "block"; // altera o display tornado-o visível
      iframe.src = "<%=BARRASTATUS%>"; // carrega uma página no iframe
   }
   return true;
}

Aí você pode definir os estilos do iframe via CSS da forma que quiser:

iframe{
   width: 100%;
   height: 400px;
   border: none;
}

Demais propriedades do iframe você pode verificar na documentação do MDN.

2
  • 1
    Show, muito obrigado sam!!! 17/07/2018 às 0:39
  • Seja bem-vindo! Se já conhece o funcionamento do site, deve marcar ✔️ apenas na melhor resposta que achou.
    – Meu ovo
    17/07/2018 às 0:41
0

Você só precisa fazer um

if (document.incluir.balancete_arquivo.value != ""){
    var frame = document.getElementById('iframe') //Id do seu iframe aqui
    frame.src = '<%=BARRASTATUS%>'; // Considerando que BARRASTATUS 
                                   //  tenha o url que vai ser passado pro frame
}

Tendo isso, o iframe já vai carregar a outra tela; Agora, você precisa definir o tamanho, visibilidade, etc...

0

Javascript

function prepareFrame() {
    if (document.incluir.balancete_arquivo.value != ""){
       var ifrm = document.createElement("iframe");
       ifrm.setAttribute("src", "<%=BARRASTATUS%>");
       ifrm.style.width = "400px";
       ifrm.style.height = "150px";
       document.body.appendChild(ifrm);
   }
}

HTML

<button type="button" onclick="prepareFrame()">Criar iframe</button>

Para criar o iframe no local exato:

function prepareFrame() {
    var ifrm = document.createElement("iframe"); 
    ifrm.setAttribute("src", "radioalfa2233.htm");
    ifrm.style.width = "400px";
    ifrm.style.height = "150px";
    //o iframe será criado antes da div de id = divqq
    var divReferencia = document.getElementById("divqq");
    // adiciona o novo elemento criado e seu conteúdo ao DOM
    document.body.insertBefore(ifrm, divReferencia);
}

e no HTML insira essa div <div id="divqq"></div> no local exato onde o iframe deva ser criado

Caso queira esconder o button após clicado

acrescente essa linha dentro do if no script

document.getElementById('bt').style.display = 'none';

e o id no button <button id="bt"....

  • A função createElement() criará um elemento HTML para ser inserido em um documento HTML
  • Aparentemente, a função createElement() não surte efeito algum, precisamos aplicar o método appendChild() para que o elemento seja, efetivamente, inserido ao documento HTML e fique visível ao usuário.
1
  • Muito bom, obrigado!!!! 17/07/2018 às 0:41

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .