✔ jQuery: bind is not a function

[DeluXe]

Moinsen die Runde.

Und zwar bastel ich noch immer an meiner jQuery Gallery in Verbindung mit der Lytebox.

Im Prinzip funktionieren beide Super, jedoch nur getrennt voneinader, zusammen gibts die o. g. Fehlermeldung. ;-)

Folgende Stelle in der Lytebox nutzt die Funktion bind

for (var i = this.imageNum; i < this.scrollImages.length; i++) {
	var newThumbnail = this.doc.createElement("img");
	newThumbnail.setAttribute('src', this.scrollImages[i][0] );

	if ( i == 0 ) newThumbnail.setAttribute( 'class', 'first' );
	else if ( i == this.imageArray.length ) newThumbnail.setAttribute( 'class', 'last' );

	newThumbnail.onclick = function() {
		myLytebox.changeContent( this.imagePosition ); return false;
	}.bind({ "imagePosition":i })

	objScrollerImages.appendChild( newThumbnail );
}

Diese Stelle gibts es jedoch nur in meiner Lytebox, da es eine Erweiterung meiner Seits ist.

Nun gibt es zwei Lösungsmöglichkeiten:

1. Ich poste zusätzlich noch den Code der jQuery Gallery und wir suchen den vermeintlichen Fehler dort, was ich allerdings für Zeitverschwendung halte, da ich ihn nicht einmal grob eingrenzen kann und man somit über 500 Zeilen studieren müsste.

2. Ich schreibe die obige Schleife so um, das bind nicht mehr gebraucht wird. Dabei fehlt mir jedoch jeglich Ansatz, wie man es anders schreiben könnte...


Nun, hat jemand einen Vorschlag, was man hier tun könnte?

*edit*
code fixed.

 

[maeTimmae]

Du versuchst eine Methode "bind" einer Funktion aufzurufen, welche diese Metode nicht implementiert:

	newThumbnail.onclick = function() {
		myLytebox.changeContent( i ); return false;
	}.bind({ "imagePosition":i });

Bin selbst nicht allzu versiert in Sachen JavaScript, aber das sieht für mich etwas seltsam aus.

Nach bestem Wissen und Gewissen habe ich deinen Schnipsel ein wenig umgeschrieben, so dass die Vorteile von jQuery besser genutzt werden. Des Weiteren habe ich nen kleinen Fehler beseitigt, der darauf zurückzuführen ist, dass ein Array in JS implementationsbedingt mit Index 0 beginnt, und Index n - 1 endet.
Was genau dein [var]bind[/var] aufrufen soll, weiß ich nun nicht. Wahrscheinlich kannst du es mit Hilfe von jQuery aber besser implementieren.

var scrollImages = $(this.scrollImages);
scrollImages.each(function(i) {
	var newThumbnail = $("<img />");
	newThumbnail.attr("src", this[ 0 ]);

	if (!i) {
		newThumbnail.addClass("first");
	} else if (i == (scrollImages.size() - 1)) {
		newThumbnail.addClass("last");
	}

	newThumbnail.bind("click", function(e) {
		myLytebox.changeContent(i);
		myLytebox.imagePosition = i; // ?
		return false;
	});

	objScrollerImages.appendChild(newThumbnail);
});

 

[DeluXe]

Du versuchst eine Methode "bind" einer Funktion aufzurufen, welche diese Metode nicht implementiert

Falsch. Naja, eigentlich schon richtig, aber nicht so ganz.
Wird die Lytebox mit eben dieser bind-Funktion genutzt, ohne das die von mir mit jQuery geschrieben Galerie geladen wird, funktioniert das obige Konstrukt ohne Probleme. Nur in Zusammenhang mit der Galerie ist die Funktion aus heiterem Himmel heraus nicht mehr definiert.

Nach bestem Wissen und Gewissen habe ich deinen Schnipsel ein wenig umgeschrieben, so dass die Vorteile von jQuery besser genutzt werden.

Nunja, um genau zu sein ist in dem Snippet gar kein jQuery zu sehen. War jedoch mein Fehler das zu erwähnen, weil das eigentlich auch so bleiben soll.
Die Lytebox soll auch weiterhin ohne jQuery auskommen, wobei mich dein Snippet auf die Idee bringt einfach zu prüfen ob jQuery da ist und, wenn ja, eine andere Variante zu nutzen.
Mal schauen ob ich mich damit anfreunden kann.

Des Weiteren habe ich nen kleinen Fehler beseitigt, der darauf zurückzuführen ist, dass ein Array in JS implementationsbedingt mit Index 0 beginnt, und Index n - 1 endet.

Jedoch wird i mit der Größe von einem anderen Array verglichen.. ;-)


Btw.:
Die drei von dir zitierten Zeile enthalten einen Fehler, sehe ich gerade..
Da ist mir durch das ganze herum probieren wohl was verloren gegangen.

 

[DeluXe]

Nun, da sich hier wohl nichts mehr tut, habe ich vorerst die Variante mit und ohne jQuery hergenommen.
Auch wenn mir diese überhaupt nicht gefällt.

if ( typeof jQuery == 'undefined' ) {
	for (var i = this.imageNum; i < this.scrollImages.length; i++) {
		var newThumbnail = this.doc.createElement("img");
		newThumbnail.setAttribute('src', this.scrollImages[i][0] );
		if ( i == 0 ) newThumbnail.setAttribute('class', 'first' );
		else if ( i == this.imageArray.length ) newThumbnail.setAttribute('class', 'last' );
		newThumbnail.onclick = function() {
			myLytebox.changeContent( this.imagePosition ); return false;
		}.bind({ "imagePosition":i });
		objScrollerImages.appendChild( newThumbnail );
	}
}
else {
	jQuery( jQuery( this.scrollImages ) ).each( function( i ){
		var img = new Image();
		jQuery( img )
			.attr( 'src', this[0] )
			.addClass( ( i == 0 ? 'first' : ( i == myLytebox.imageArray.length ? ' last' : '' ) ) )
			.bind( 'click', function(){
				myLytebox.changeContent( i ); return false;
			})
			.appendTo( objScrollerImages );
	});
}

So funktioniert es einwandfrei, nur ich begreife nicht wieso..

*edit*
Wie lustig, das Forum schickt Nachrichten an Firebug.

 

[Quaese]

Hi,

was mich wundert - dass bind überhaupt bekannt ist, wenn du nur die Lytebox einbindest!? Meines Wissens existiert die Methode dort gar nicht.

Als Lösung könntest du dem onclick-Event ein neu erstelltes Funktionsobjekt zuweisen:

newThumbnail.onclick = new Function('fx', "myLytebox.changeContent("+i+"); return false;");

Vielleicht hilft dir das weiter.

Ciao
Quaese

 

[DeluXe]

Du hast recht, wird jQuery/prototype nicht geladen, ist bind ebenfalls nicht definiert.
Wird eines der beiden jedoch geladen, existiert die Funktion. Da war ich wohl mit der Annahme, das sei eine Standardfunktion, auf dem Holzweg.

(Was jedoch trotzdem nicht erklärt, wieso sie in diesem einen Fall dennoch nicht deklariert ist, obwohl jQuery ja geladen ist.)

Die Varirante, eine neue Funktion zu erstellen, habe ich eben mal ausprobiert und - was soll ich sagen - es schnurrt wie ein Kätzchen.

Danke dir vielmals, früher oder später wäre ich sicher wieder über die bind-Funktion gestolpert.