solve programming

Question

solve programming

Navigation

#1 by (0 votes)

1

I need help on the lines below where video and image appear when I type the 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 out the video and image when I type the photo.

javascript

asked by anonymous 03.06.2017 / 22:30

1 answer

Login page and password How to enable cross-origin in tomcat?

score 0 · Answer 1

I believe the problem is that you are using two different divs for each element. If you want to or display the video or the photo, you can use the same div, and swap their content through 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>