Hallo hoffe auf hilfe bin ganz frisch auf dem gebiet der Webentwicklung.
habe zu lernzwecken eine kleine webseite gebaut und javascripte mit eingebunden.
datei slider.js ( habe auf der startseite ein bild was sich ändern soll auf ein anderes )
nichts spektakuläres was leichtes für den anfang um den ablauf zu verstehen.
Code
var i = 0;
var images = [];
var time = 3000;
images[0] = "bin/1.jpg";
images[1] = "bin/bin/2.jpg";
images[2] = "bin/bin/3.jpg";
images[3] = "bin/bin/4.jpg";
images[4] = "bin/bin/5.jpg";
function changeImg(){
document.slide.src = images[i];
if(i < images.length - 1){
// Add 1 to Index
i++;
} else {
i = 0;
}
setTimeout("changeImg()", time);
}
window.onload = changeImg;
Alles anzeigen
Nun versuche ich mich an einer Searchbar mit funktion alles soweit so gut
datei search.js
Code
function Search(item)
{
var collection = document.getElementsByClassName("listItem");
for (i = 0;i < collection.length; i++)
{
if (((collection[i].innerHTML).toLowerCase()).indexOf(item) > -1)
{
collection[i].style.display = "block";
}
else
{
collection[i].style.display = "none";
}
}
}
Alles anzeigen
im html
Code
<div id="searchbar">
<input type="text" id="inputSearch" oninput = "Search((this.value).toLowerCase())" placeholder="Wonach suchst du ?" autocomplete="off" >
<!--<button id="btnSearch" type="submit" onclick="checkSearch()">Suchen</button>-->
<div id="myUL">
<a class="listItem" style="display: block;" href="index.php">index</a>
<a class="listItem" style="display: block;" href="datenschutz.php">datenschutz</a>
<a class="listItem" style="display: block;" href="index.php">Home</a>
<a class="listItem" style="display: block;" href="contact.php">contact</a>
</div>
</div>
Alles anzeigen
nun folgendes problem sobald ich in meinem input nach etwas suche und die auswahlmöglichkeiten durch display = "none" verringer stoppt das andere script und das nächste bild was laden soll fällt einfach aus <img src"undefined">
wie kann ich scripte nebenher laufen lassen sodass beides funktioniert.
wäre über jeden tipp dankbar