Uczę się na pewny przedmiot i przydałaby mi się taka wspomagająca prosta apka dzięki której mógłbym weryfikować swoją wiedzę.
Odpalam sobie index.html i wyświetlić się ma "z bazy danych" losowy obrazek. (to już mam zrobione).
Tylko chciałbym jeszcze do tego mieć guzik gdzieś nad obrazkiem "Pokaż odpowiedź", który po kliknięciu pokazałby dodatkowe, przypisane zdjęcie nad wyświetlonym obrazkiem. Można założyć, że to przypisane zdjęcie zawsze nazywa się tak samo jak wylosowany obrazek tylko np. ma dodany prefix answer_
do nazwy pliku .jpg
.
Baza danych zdjęć jest mała, więc im brzydszy kod tym wręcz bardziej wskazany, bo jest dla mnie czytelniejszy. Bez żadnych pętli i innych cudów technologii.
W skrócie dla obrazka zad 1.jpg
po kliknięciu button
powinien pojawić się nad wyświetlonym obrazkiem zad 1.jpg
dodatkowy obrazek przypisany do niego tj. answer_zad1.jpg
. Później robię F5 stronki, skrypt losuje nowy obrazek i znów mogę kliknąć button i tak w kółko...
Mam taki kod:
<html>
<script type="text/javascript">
function randomImg1() {
var myImages1 = new Array();
myImages1[1] = "Zad 1.jpg";
myImages1[2] = "Zad 2.jpg";
myImages1[3] = "Zad 3.jpg";
var rnd = Math.floor(Math.random() * myImages1.length);
if (rnd == 0) {
rnd = 1;
}
document.write('<img class="who" src="' + myImages1[rnd] + '">');
}
function showAnswer() {
document.write(<'img src="' + 'answer_' + myImages1[rnd] + '">');
}
</script>
<body>
<button onClick="showAnswer();">Show answer</button>
<script> randomImg1(); </script>
</body>
</html>
Czy mógłby ktoś poprawić ten guzik aby dodawał przypisane obrazek nad wyświetlony losowy obrazek po kliknięciu buttona?
Mówiąc wprost: nie umiem nic z JS'a, a zależy mi na czasie, dlatego w ogóle to pytanie i dlatego sam tego nie ogarnąłem. Absolutnie nie zależy mi na jakichkolwiek dobrych praktykach (i tak ich nie zauważę, i na nic się nie przydadzą, a to już końcowa faza tego niesamowicie złożonego projektu).
Byłbym bardzo wdzięczny.