Autor |
Nachricht |
DerM
Threadersteller
Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht:
|
Verfasst Do 17.09.2009 09:50
Titel Javascript: Existenz von Div abfragen |
|
|
Hallo zusammen,
ich sitze grad etwas unter Zeitdruck, und weiß nicht weiter da ich eben voll aus meinem Konzept gebracht wurde.
Und zwar geht es darum das ich mehr oder minder dynamisch DIVs anzeigen lassen möchte oder ausblenden möchte.
Das sollte am besten über die ID gehen.
Nun zu meinem Problem wie bekomm ich das hin.
Ich habe eine Reihe an Checkboxen die jeweils eine inkrementelle ID haben. Und ich habe DIVs die in der ID jeweils die ID der Checkbox enthalten können.
beispiel: Checkbox hat geklickt die ID 3
Div kann als ID die 3 enthalten <div id="irgendwas-3,2,1">
Nun soll mir das Script am besten nur die DIVS anzeigen, in welcher die ID 3 vorkommt und alle anderen ausblenden. Habter da en Tipp für mich? Ist sowas überhaupt möglich, evtl über eine Array Struktur, oder sowas ??
Ich hoffe ihr versteht mich überhaupt..
Danke schonmal ...
|
|
|
|
|
bacon
Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
|
|
|
|
|
Anzeige
|
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Do 17.09.2009 09:58
Titel
|
|
|
zb (ohne jquery, mootools und co)
in die checkbox
Code: |
onclick="showDiv(this.id)"
|
im js
Code: |
function showDiv(z) {
document.getElementById('irgendwas'+z).style.display = 'block';
}
|
das kommt wohl dazu, wenn er als id in der checkbox richtigerweise mehr als nur ne zahl hat
Zuletzt bearbeitet von pixelpapst303 am Do 17.09.2009 09:59, insgesamt 1-mal bearbeitet
|
|
|
|
|
DerM
Threadersteller
Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht:
|
Verfasst Do 17.09.2009 10:00
Titel
|
|
|
soweit war ich auch schon, aber wie bekomm ich das nun auf das DIV angewendet?
wie gesagt die DIVs können so aussehen.
Code: |
<div id="irgendwas-3,2,1">.. soll angezeigt werden
<div id="irgendwas-5,12,13">.. soll ausgeblendet sein
<div id="irgendwas-3,6,17">.. soll eingeblendet sein
|
Wenn ich also nun die ID 3 in der Checkbox anklicke, soll DIV 1 und 3 sichtbar sein, DIV 2 hingegen ausgblendet werden.
Gruß
|
|
|
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Do 17.09.2009 10:31
Titel
|
|
|
Hier mal ne grundlage mit kommentaren - ist ungetestet und zu mehr habe ich grade keine zeit.
Vielleicht hilft's ja
Code: | function initCheckboxes(checkboxes) {
// alle input elemente innerhalb des checkbox containers abgrasen
for(i=0;i<checkboxes.getElementsByTagName("input");i++) {
// nur checkboxen auswählen
if(checkboxes[i].type="checkbox") {
// bei änderungen des status der checkbox
checkboxes[i].onchange = function() {
showHideDivs(this);
}
}
}
}
function showHideDivs(el) {
// alle divs innerhalb des containers
for(i=0;i<divs.length;i++) {
// in der id nach dem zeichen "-" suchen
tmp = divs[i].id.split("-");
// wenn das erste zeichen nach dem "-" der übergebenen id entspricht und die angeklickte checkbox "checked" ist: einblenden
if(tmp[1].substr(0,1) == el.id && el.checked == true) {
divs[i].style.display = "block";
} else {
// sonst: ausblenden
divs[i].style.display = "none";
}
}
}
window.onload = function() {
// das hier anpassen mit deinen containern
var divContainer = "divs"
var checkboxes = "checkboxes"
// das hier nicht :)
var divs = document.getElementById(divs).getElementsByTagName("div");
var checkboxes = document.getElementById(checkboxes).getElementsByTagName("input");
initCheckboxes(checkboxes);
} |
Zuletzt bearbeitet von sahnemuh am Do 17.09.2009 10:36, insgesamt 2-mal bearbeitet
|
|
|
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Do 17.09.2009 10:36
Titel
|
|
|
ich hät diesen ansatz hier
Code: | <html>
<head>
<script type="text/javascript">
var allHTMLTags = new Array();
function getElementByMultiId(theID,sty) {
var allHTMLTags=document.getElementsByTagName('div');
for (i=0; i<allHTMLTags.length; i++) {
if (allHTMLTags[i].id.search(theID)!= -1 && allHTMLTags[i].id.search(/irgendwas/)!= -1) {
allHTMLTags[i].style.display = sty;
}
}
}
function getByC(z) {
getElementByMultiId('alles','none');
getElementByMultiId('irgendwas'+z,'block');
}
</script>
</head>
<body>
<a id="2" onclick="getByC(this.id);">Klick</a>
<div id="alles,irgendwas2,3,4">- 2 3 4 -</div>
<div id="alles,irgendwas1,3,4">- 1 3 4 -</div>
<div id="alles,irgendwas0,3,4">- 0 3 4 -</div>
</body>
</html> |
müsste man nur noch verhindern, dass bei 2 nicht auch ein div mit der id irgendwas21 o.ä. angesprochen wird aber das is eigenleistung... so!
|
|
|
|
|
DerM
Threadersteller
Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht:
|
Verfasst Do 17.09.2009 12:05
Titel
|
|
|
Danke, Danke Die Ansätze versteh ich. Werd ich auch so umsetzen. Aufgrund des Zeitmangels habe ich das ganze dann doch über einen Ajax Request gemacht, was eigentlich auf Grund der Perfomance verboten war...
Ich werde mir aber auch eure Lösungen nochmal zu Herzen führen (in einer ruhigen Minute), und diese dann umsetzen.
you're my Hereos
|
|
|
|
|
|
|
|
Ähnliche Themen |
{javascript} Hauptspeicher abfragen
javascript else if radio button abfragen
Javascript: Aktivierung von Ckeckbox mit best. Wert abfragen
Problem: per Javascript Radiobuttons abfragen geht nicht?
Zielpfad via AS auf Existenz überprüfen | Flash MX
SQL Abfragen mit Java
|
|