Моя кнопка с идентификатором «jump-button» вообще не работает. Всякий раз, когда на нее нажимают, ничего не произойдет. (Я добавил alert (); к атрибуту onclick, чтобы я знал, когда кнопка работает.
Две другие кнопки (вперед и назад) работают абсолютно нормально.
<body>
<div id="fact">Fact #1: In 2002, the most popular boat name in the U.S. was Liberty</div>
<input id="next" type="image" src="images/next-button.png" name="next" value="Next" onClick="num++;document.getElementById('fact').innerHTML=getFact(num);"/>
<input id="prev" type="image" src="images/prev-button.png" name="previous" value="Prev" onClick="num--;document.getElementById('fact').innerHTML=getFact(num);"/>
<p id="jump-text">Jump To Fact #</p>
<input id="textarea" type="text" name="factNumber" />
<input id="jump-button" type="image" src="images/jump-button.png" name="jump" value="Jump" onClick="alert();num = document.getElementById('textarea').value;document.getElementById('fact').innerHTML='getFact(num);"/>
</body>
Внешний файл JS (он был вставлен в заголовок HTML)
facts = [element1, element2, ... wayy too many elements to have them all here];
var num = 1;
function getFact (num){
return 'Fact #' + num + ' ' + facts[num-1];
}
Как вы можете видеть, это очень простое приложение, создаваемое (которое просто просматривает различные интересные факты). Я довольно новичок в javascript, поэтому, пожалуйста, извините, если я сделал очень вопиющую ошибку.
Мой CSS-файл тоже очень приятный и простой, я сомневаюсь, что он вызывает проблемы, но если он понадобится, я его сниму по запросу.
Наконец, остальная часть html <head>
также очень проста (состоит только из некоторых метаданных, заголовка, импорта CSS и JavaScript).
Если кому-то нужна дополнительная информация, чтобы помочь мне заставить работать кнопку «прыжок», спросите.