solve programming

Asked

Viewed 63 times

1

I need help in the lines below where video and image appear when I type photo

var nota = document.getElementById("text").value;

function limparimg() {
  document.getElementById("div").innerHTML = "";
}

function limparvid() {
  document.getElementById("video").innerHTML = "";
}

function videoof() {

  var video = document.getElementById("video");
  var video = video.className;
  var iFrame = document.getElementById("caixa");
  iFrame.src = "https://www.youtube.com/embed/" + video;
}


function mostracav() {
  var foto = "<img src=http://www.ficasimples.com.br/eliza/cavit.jpg>";
  new Array(10);


  document.getElementById("div").innerHTML = foto;
}

function talk() {
  var nota = document.getElementById("text").value;
  var vid = "vid";
  if (nota == "vid") {
    videoof();
  }


  var qya = "foto";
  if (nota == "foto") {
    mostracav();
  }
}
<h2>My First JavaScript</h2>
<div id="video" class="UJAwNkhbYWM"><iframe id="caixa" allowfullscreen="" frameborder="0" height="200" width="250"></iframe> </div>
<div id="div"><img id="img"></div>
<br> Enter Text To Play:
<input id="text" value="">&nbsp;
<br>
<button class="btn btn-success" onclick="talk()">Atenas
    Falar!</button>

<button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
    Click me to display Date and Time.</button>
<p id="demo"></p>

You can check why the video and image appears when I type photo.

javascript

  • This loose array makes no sense var foto="<img src=http://www.ficasimples.com.br/eliza/cavit.jpg>";new Array(10);, I tested here and only appeared the photo, iframe was not updated, must be getting confused.

  • Hello Silezia! I put an answer, but I don’t know if I really understand what you asked - if you can, please clarify your intention better editing the question.

1 answer

0

I believe the problem is that you are using two different Ivs for each element. If the intention is to show or the video or the photo, you can use the same div, and exchange their content for javascript.

Take a look at the example below:

var nota = document.getElementById("text").value;

function limpar() {
  document.getElementById("video-foto").innerHTML = "";
}

function videoof() {
    limpar();
    var video = document.getElementById("video-foto");
    var ifr = document.createElement("iFrame");
    ifr.setAttribute("id", "caixa");
    ifr.setAttribute("height", "200");
    ifr.setAttribute("width", "250");
    video.appendChild(ifr);
    ifr.src = "https://www.youtube.com/embed/" + video.className;
}

function mostracav() {
    limpar();
    var foto = "<img src=http://www.ficasimples.com.br/eliza/cavit.jpg>";
    document.getElementById("video-foto").innerHTML = foto;
}

function talk() {
    var nota = document.getElementById("text").value;
    if (nota == "vid") {
    videoof();
    }

    if (nota == "foto") {
        mostracav();
    }
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>                                                                    
<h2>My First JavaScript</h2>
<div id="video-foto" class="UJAwNkhbYWM">
</div>
<br> Enter Text To Play:
<input id="text" value="">&nbsp;
<br>
<button class="btn btn-success" onclick="talk()">Atenas
    Falar!</button>

<button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
    Click me to display Date and Time.</button>
<p id="demo"></p>
</body>
<script src="./javascript.js"></script>
</html>

  • Solved the problem. This is exactly what I wanted.

  • @Legal silezia - when an answer fits you, and you have your question solved, you can mark it as accepted by clicking on the check mark next to the answer. See more on tour how the site works. :)

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.