Looking to replace a simple anchor link with JavaScript array code. We're taking the long route here, and it's not as straightforward as we thought. The scrollTo property isn't working for us; can anyone spot where we might be going wrong?
Here's the snippet of JavaScript:
$(function(){
//Search index for Cards
var gameA = new Array('normal','ex','promo','counterfeit');
$('#go').click(function(e){
var term = $('#term').val();
var searchIndex = gameA.indexOf(term);
console.log(term);
console.log(searchIndex);
if (searchIndex > -1){
console.log("hi");
window.scrollTo(0,"#sec"+searchIndex);
}
});
});
And this is the source code in question:
<h2 id="top">Select a Term</h2>
<p>List: Normal, Ex, Promo, Counterfeit</p>
<form action="javascript:void(0)">
<label for"term">Enter a term from the list above.</label><br>
<input type="text" id="term" name="term">
<button id="go">Go</button>
</form>
</div>
<!-- More elements below -->
<br><br>
<img src="images/fancycards.jpg" width="1191" height="670" alt="fancy cards"><br>
<h2 id="sec0">Normal Cards</h2>
<p><a href="#top">Back to Top</a></p>
<img src="images/cards.jpg" width="1131" height="707" alt="cards"><br>
<h2 id="sec1">Ex Cards</h2>
<p></p>
<img src="images/excards.jpg" width="1000" height="653" alt="ex cards"><br>