Benutzerdefinierte jQuery-Funktion funktioniert nicht auf WordPress auch wenn andere geladene jQuery-Funktionen arbeiten

Ich bin mit WordPress 3.8.1. Ich möchte diese Funktion verwenden, um den klebrigen header 

<script>
$(document).ready(function() {
    var $header = $("header"),
        $clone = $header.before($header.clone().addClass("clone"));

    $(window).on("scroll", function() {
        var fromTop = $(window).scrollTop();
        console.log(fromTop);
        $("body").toggleClass("down", (fromTop > 200));
    });
});        
</script>

Aber es ist nicht für mich arbeiten, und ich weiß nicht, warum. Ich weiß, dass jQuery ist geteilt auf meiner WordPress, weil Flexslider 2 funktioniert jetzt einwandfrei.

  • Jeder Ausgang über die Entwickler-Konsole? Was meinst du mit Flexslider 2 funktioniert nun.
  • ich bin ein neuer Programmierer weiß nicht, über Entwickler-Konsole , ich denke, wenn die jquery-Bibliothek did ' NT share auf meinem wordpress-flexslider nicht funktionieren
  • tut .on() arbeiten auf jquery wordpress verwenden ( die ich habe zu verwenden .live() verwendet werden)
InformationsquelleAutor Beginner | 2014-02-22
  1. 13

    Fügen Sie diese:

    var j = jQuery.noConflict();

    Nun, Sie können schreiben Sie Ihre jQuery-code wie folgt:

    j(document).ready(function(){
    j('.class').event(function(){

      //your action............

    });
  });

    Nur weisen die noConflict() Funktion einer Variablen zu, und verwenden Sie die variable statt $ gesehen im jQuery-code.

    InformationsquelleAutor Mayur Devmurari
  2. 3

    Nicht laufen Ihre jquery in einem Skript. Dies wird brechen sonstige scripts in wordpress.

    Machen .js-Datei und fügen ihn in Ihre functions.php Datei wie diese.

    */**
 * Proper way to enqueue scripts and styles
 */
function theme_name_scripts() {
    wp_enqueue_style( 'style-name', get_stylesheet_uri() );
    wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array('jquery'), '1.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );*

    Dann in Ihr .js-Datei, wickeln Sie Ihren code in einem No Conflict wrapper. Die Verwendung von $() wird return undefiniert sonst.

    jQuery(document).ready(function($) {
    var $header = $("header"),
        $clone = $header.before($header.clone().addClass("clone"));

    $(window).on("scroll", function() {
        var fromTop = $(window).scrollTop();
        console.log(fromTop);
        $("body").toggleClass("down", (fromTop > 200));
    });
});
    • danke ja , ich habe es aber immer noch nicht funktioniert 🙁
    InformationsquelleAutor hyperdrive
  3. 1

    Spät zur party hier, aber die richtige Lösung ist:

    Verstehen, dass in WordPress, jQuery geladen wird kein Konflikt - Modus. Dies bedeutet, dass die $ variable nicht verweisen auf jQuery.

    Aber, indem Sie Ihre Skripts das zu verwenden ist ein no-Konflikt-safe-Dokument bereit, die Sie verwenden können, die $ innerhalb der Funktion.

    Ändern Sie Ihr Skript wie folgt:

    //original code - doesn't work, because $ is not jQuery in WordPress
//$(document).ready(function() {
//shorthand no-conflict-safe document ready:
jQuery(function($) {
    //Now $ is safe to use - it references jQuery within this doc ready function
    var $header = $("header"),
        $clone = $header.before($header.clone().addClass("clone"));

    $(window).on("scroll", function() {
        var fromTop = $(window).scrollTop();
        console.log(fromTop);
        $("body").toggleClass("down", (fromTop > 200));
    });
});
    InformationsquelleAutor cale_b
  4. 0

    Haben Sie versucht, die Einstellung der jquery-Datei in den header ein (vorausgesetzt, Sie haben die jquery-Datei in Ihrem templates-Ordner haben, aber es kann überall sein, solange Sie es richtig):

    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.3.2.min.js"></script>

    Beispiel 

    $(document).ready(function(){
     $("#container").alert("blah");
     $(".goodshelf_ul li:first").css("border-top: none;");
     $(".custom_ul li:first").addClass("first");
     $("#footer .frame:last").css("margin: 0;");
     $("#footer .frame:last").addClass("last");
});

    Verwende ich jquery auf alle meine wordpress-Seiten und es funktioniert gut
    hoffe, das hilft.

    InformationsquelleAutor INDERJEET VASHISTA
Schreibe einen Kommentar