it-swarm.com.de

kombinieren von JS-Skripten aus einem JS-Newb

Ich habe eine kleine .js-Datei auf meiner WP-Site, in die ich alle meine kleinen js-Skripte eingefügt habe. Es funktioniert perfekt, aber ich versuche nicht, herauszufinden, wie ich ein anderes Skript hinzufügen kann. Bisher beschwert sich jslint nicht über meine aktuelle Datei und sagt, dass sie in Ordnung ist.

mein Drehbuch:

jQuery(function ($) {
function mycarousel_initCallback(carousel) {
jQuery('.jcarousel-control a').bind('click', function() {
    carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
    return false;
});

jQuery('.jcarousel-scroll select').bind('change', function() {
    carousel.options.scroll = jQuery.jcarousel.intval(this.options[this.selectedIndex].value);
    return false;
});

// Next Button
$('#mycarousel-next').bind('click',
function() {
    carousel.next();
    return false;
});

// Prev Button
$('#mycarousel-prev').bind('click',
function() {
    carousel.prev();
return false;
});
};
}

Das Skript, das ich hinzufügen möchte, beginnt folgendermaßen:

jQuery(document).ready(function($) {
var gallery = $('#thumbs').galleriffic({
    delay:                     3000, // in milliseconds
 });
});

Wenn ich nicht weiterkomme, finde ich viele Skripte, die mit dem Teil jQuery (document) beginnen. Wenn ich versuche, Skripte hinzuzufügen, die so beginnen, bricht alles zusammen.

Ich vermute, das ist eine wirklich blöde Frage, aber was muss ich in dem neuen Addon-Skript ändern, damit es mit meiner aktuellen Datei in Nizza abgespielt wird?

vielen Dank für Ihre Hilfe und Zeit in diesem Fall. Ich versuche hart, js zu lernen, obwohl es hier ein langsamer Prozess ist.

1
shawn

Das Ereignis jQuery(document).ready wird aufgerufen, wenn das Dokument-DOM manipulationsbereit ist. Früher haben wir alle unsere Handler an document.load angehängt, aber das wartet, bis auch alle Bilder geladen sind, und die meiste Zeit braucht man das nicht.

Es gibt drei äquivalente Möglichkeiten, sich in dieses Ereignis einzuklinken, und eine vierte, fast äquivalente:

// Long form
jQuery(document).ready(function() {
    // Your handler
});

// Short form
jQuery(function() {
    // Your handler
});

// Intermediate form (not recommended)
jQuery().ready(function() {
    // Your handler
});

// Classic event binding - will not be executed again if you hook it too late
jQuery(document).bind("ready", function() {
    // Your handler
});

Manchmal wird $ anstelle von jQuery verwendet. Dies ist einfach, weil es kurzgeschlossen ist, aber einige andere JS-Bibliotheken verwenden es auch. Um das Überschreiben anderer zu verhindern, kann jQuery im Modus noConflict ausgeführt werden. Dies bedeutet, dass $ nicht verwendet wird, sondern nur jQuery. Das erste Argument für Ihren ready -Handler ist jedoch das jQuery-Objekt selbst. Dies bedeutet, dass Sie Ihren Handler wie function($) {} schreiben und $ innerhalb Ihrer Funktion verwenden können.

Ihr Code würde also ungefähr so ​​aussehen:

jQuery(function ($) {
    function mycarousel_initCallback(carousel) {
        jQuery('.jcarousel-control a').bind('click', function() {
            carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
            return false;
        });

        jQuery('.jcarousel-scroll select').bind('change', function() {
            carousel.options.scroll = jQuery.jcarousel.intval(this.options[this.selectedIndex].value);
            return false;
        });

        // Next Button
        $('#mycarousel-next').bind('click',
        function() {
            carousel.next();
            return false;
        });

        // Prev Button
        $('#mycarousel-prev').bind('click',
        function() {
            carousel.prev();
        return false;
        });
    };

    // We are already in the 'ready' event handler, no need to hook into it again
    // Just add our code here!
    var gallery = $('#thumbs').galleriffic({
        delay:                     3000, // in milliseconds
    });
}

Wenn Sie mehr reine JavaScript-Fragen haben, können Sie diese auf unserer übergeordneten Site Stack Overflow stellen. Sie haben viel jQuery-Fachwissen dort.

3
Jan Fabry