Hallo Jungs,
ich bastle grade an einem Prinzip, dass ich den Content von anderen Seiten dynamisch in ein Div der aktuellen Seite einlade. Das klappt auch ganz gut, aber dann hatte ich das Problem, dass auf den Nachgeladenen Seiten kein JS mehr ausführen konnte. Gut, das habe ich anschließend behoben, nun ja, zumindest etwas. Problematisch ist, dass ich zwar angeben kann, welche Funktionen von dem eingeladenen Inhalt "angehangen" werden sollen, aber ich kann nicht differenzieren. Sprich, wenn ich alle möglichen FUnktionen aus der 2. Datei aufliste, und irgendetwas ausführen lasse, DANN werden alle angegebnen Funktionen ausgeführt und nicht nur die eine Bestimmte. Kann mir jemand von euch erklären, wie ich das in den Griff bekomme?

Hier mal der JS-Code der ersten Seite:

Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

var global ="1";
 
function DelayedFinished() {
    var oDiv = $('#content');
    
    if (oDiv) {
        // Ursprüngliches Event wieder dranhängen, da ja nur HTML kopiert
        // wurde und nicht das dortige DOM-Objekt mit allen handlern
        oDiv.click(ClickEvent_2);
        oDiv.click(global_ink_2);
        oDiv.click(global_dif);
    } else {
        alert('Geladenes DIV konntn icht gefunden werden!');
    } // end of if
};
 
function StartLoading() {
    var oDiv = $('#import');
    
    if (oDiv) {
        // Das Timeout hier ist wichtig, weil die Funktions sonst versuchen
        // würde ein ClickEvent an ein Element zu hängen, dass noch nciht richtig da ist
        oDiv.load('datei2.html #content', setTimeout('DelayedFinished()', 750));
    } else {
        alert('Div nicht gefunden!');
    } // end of if
};
 
function Alert(){
    alert (global);
}
 
function global_ink(){
    global++;
}
 
$(document).ready(function() {                                  //Funktion stellt sicher, dass Dokument vollständig geladen ist, bevor Skript startet
    var oButton = $('#load');
    var oButton2 = $('#button1');
    var oButton3 = $('#button2');
        
    if (oButton) {
        oButton.click(StartLoading);
    } else {
        alert('Button wurde nicht gefunden!');
    } // end of if
    
    if (oButton2) {
        oButton2.click(Alert);
    }
    
    if (oButton3) {
        oButton3.click(global_ink);
    } 
 
 
});

Und der JS-Code der einzuladenden Datei:

Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

function ClickEvent_2() {
    global++;
    alert("Du hast mich angeklickt!");
};
 
function global_ink_2(){
    global=global+1;
    alert(global);
}
 
function global_dif(){
    global--;
    alert(global);
}
 
$(document).ready(function() {                                  //Funktion stellt sicher, dass Dokument vollständig geladen ist, bevor Skript startet
    var oButton = $('#button');
    var butt_4 = $('#b4');
    var butt_5 = $('#b5');
    
    
    if (oButton) {
        oButton.click(ClickEvent_2);
    } else {
        alert('Button wurde nicht gefunden!');
    } // end of if
    
    if (butt_4) {
        butt_4.click(global_ink_2);
    }
    
    if (butt_5) {
        butt_5.click(global_dif);
    }
    
});

Wenn ich jetzt also einen Button der Datei 2 anklicke, dann werden ClickEvent_2, global_ink_2 und global_dif aufgerufen, in genau dieser Reihenfolge. Ich möchte aber, dass je nachdem welcher Button gedrückt wurde, auch nur die diesem Button zugedachte Funktion ausgeführt wird. Hat Jemand eine Idee dazu?