Hallo, ich bin neu in der Community und habe eine Frage zu einem Script welches anhand einer InputBox aus einer Liste entsprechend einer Eingabe eine Div Tag referenziert.
Der Code ist entsprechend kommentiert - die Suche funktioniert mit einem festen Wert, dieser soll jedoch dynamisch (Suche2) aus dem Div auswählen. Die Übergabe funktioniert theoretisch schon über den Button "Anzeige" (nur zum Testen).
Als Grundlage gibt es hier das entsprechende Grundkonzept https://www.tutorials.de/threads/innerhalb-eines-divs-zu-element-mit-bestimmter-id-springen.362341/
Ggf. kann mir kurzfristig jemand weiterhelfen - vielen Dank vorab. MfG
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<!-- vorläufiger Style für Div Tag -->
<style>
#listScrollable {
height: 200px;
overflow: auto;
border: 1px solid #000;
background: #fff;
}
#listScrollable li{
height: 50px;
}
.current {
font-weight: bold;
}
</style>
<!-- Auswahl aus DIV Tag -->
<script type="text/javascript">
<!--
function setOffset(objElem, objHolder){
var intOffY1 = objElem.offsetTop;
var objHelp1 = objElem.offsetParent;
while(objHelp1){
intOffY1 += objHelp1.offsetTop;
objHelp1 = objHelp1.offsetParent;
}
var intOffY2 = objHolder.offsetTop;
var objHelp2 = objHolder.offsetParent;
while(objHelp2){
intOffY2 += objHelp2.offsetTop;
objHelp2 = objHelp2.offsetParent;
}
objHolder.scrollTop = intOffY1 - intOffY2;
}
//-->
</script>
<!-- Ausgabe für ID aus InputBox -->
<script>
function ubergabe() {
var x = document.getElementById("frm2").value;
document.getElementById("demo").innerHTML = x;
}
</script>
<!-- CSS Datei einbinden -->
<link rel="stylesheet" type="text/css" href="css/Baum.css"/>
</head>
<body>
<!-- Input Form -->
<input id="frm2" type="text" name="fname1" value="0005" step="1">
<!-- Suche 1 - fest codiert funktioniert -->
<button onclick="setOffset(document.getElementById('0005'), document.getElementById('listScrollable'));">SUCHE</button>
<!-- Suche 2 - variabel codiert funktioniert nicht -->
<button onclick="setOffset(document.getElementById("frm2").value, document.getElementById('listScrollable'));">SUCHE2</button>
<!-- optionen -->
<div id="listScrollable">
<ul>
<li id="0001"><a href="#">0001</a></li>
<li id="0002"><a href="#">0002</a></li>
<li id="0003"><a href="#">0003</a></li>
<li id="0004"><a href="#">0004</a></li>
<li id="0005"><a href="#">0005</a></li>
<li id="0006"><a href="#">0006</a></li>
</ul>
</div>
<!-- Anzeige der Referenz InputForm -->
<p id="demo"></p>
<!-- ausgabe -->
<button onclick="ubergabe()">Anzeige</button>
<!-- back zur letzten Seite -->
<input target="_blank"type="button" value="Zurück" onClick="history.back()">
</body>
</html>
Zuletzt bearbeitet:
