Tässä tehtailen sivustolle uutta HTML video esitystä.
En kuitenkaan saa toimimaan javascriptin video vaihtoa, jokin tuossa nyt mättää ja en netistä vielä ole apua löytänyt tuohon.
<!DOCTYPE html>
<html>
<script language="JavaScript" type="text/javascript">
var movie = new Array();
movie[1] = "video/lintu.mp4";
movie[2] = "video/nuotio.mp4";
movie[3] = "";
movie[4] = "";
</script>
<body>
<button onclick="myFunction('1')" type="button">Change Video 1</button><br>
<button onclick="myFunction('2')" type="button">Change Video 2</button><br>
<video id="myVideo" width="320" height="240" controls autoplay>
<source id="mp4_src" src="video/AAPG.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
<script>
function myFunction(play) {
document.getElementById("mp4_src").src = "movie[play]";
document.getElementById("myVideo").load();
}
</script>
</body>
</html>Siinä mättää tietenkin se, että kun teksti on lainausmerkeissä, se on vain tekstiä eikä sitä etsitä mistään muuttujasta. Eli tietenkin "movie" ja movie ovat koodissa kaksi aivan eri asiaa.
Kiitos, olinpahan ...?
On tosta vähän aikaa kun viimeksi on tuota JavaScriptiä väännelty mutta nyt pääsen tässä hommassa kivasti eteenpäin.
Suora vastaus:
myFunction('1')
// -->
myFunction(1)ja
"movie[play]"; // --> movie[play];
var movie = new Array(); movie[1] = "video/lintu.mp4"; movie[2] = "video/nuotio.mp4"; movie[3] = ""; movie[4] = "";
Tämän voi muuttaa myös tällaiseksi:
var movie = ["video/lintu.mp4", "video/nuotio.mp4"]
noutti kirjoitti:
var movie = new Array(); movie[1] = "video/lintu.mp4"; movie[2] = "video/nuotio.mp4"; movie[3] = ""; movie[4] = "";Tämän voi muuttaa myös tällaiseksi:
var movie = ["video/lintu.mp4", "video/nuotio.mp4"]
Tällöin vain pitää pitää huoli, että indeksit ovat mitä halutaan. Jos videoiden hallinta luodaan automaattisesti, ei mitään huolta pitäisi olla, mutta jos indeksit on kovakoodattuna, niin tällöin pitää huomioida esim. että arrayt alkaa oletuksena 0:sta eikä 1:stä kuten AP on listan kovakoodannut.
Toisaalta osoitteet voisi laittaa HTML:ään data-attribuutteina (tai onclickiin, jos haluaa sitä käyttää). Näin pääsee eroon koko taulukosta.
<button data-movie="video/lintu.mp4" onclick="myFunction(this.dataset.movie)">
Tai sitten voisit tehdä tästä kunnon overkill metodin jatkamalla tätä:
https://codesandbox.io/s/zen-wozniak-vpwj5?file=/src/index.js
Aihe on jo aika vanha, joten et voi enää vastata siihen.