Μέθοδος jQuery noConflict()

Πώς μπορείτε να χρησιμοποιήσετε το jQuery και άλλα πλαίσια παράλληλα στη σελίδα;

jQuery και άλλοι JavaScript πλαίσια

Καθώς ήδη γνωρίζετε, το jQuery χρησιμοποιεί το σύμβολο $ ως συντομευτική γραφή του jQuery.

Τι γίνεται αν και άλλες βιβλιοθήκες JavaScript χρησιμοποιούν το σύμβολο $ ως συντομευμένη μορφή;

Άλλες βιβλιοθήκες JavaScript περιλαμβάνουν: MooTools, Backbone, Sammy, Cappuccino, Knockout, JavaScript MVC, Google Web Toolkit, Google Closure, Ember, Batman και Ext JS.

Κάποιοι από τους κύριους JavaScript βιβλιοθήκες χρησιμοποιούν το σύμβολο $ ως συντομευμένη μορφή (όπως το jQuery), αν χρησιμοποιείτε δύο διαφορετικές βιβλιοθήκες που χρησιμοποιούν το ίδιο συντομευμένο σύμβολο, μπορεί να προκαλέσει διακοπή της εκτέλεσης του κώδικα.

Η ομάδα του jQuery έχει λάβει υπόψη αυτή την πρόκληση και έχει υλοποιήσει τη μέθοδο noConflict().

Μέθοδος jQuery noConflict()

Η μέθοδος noConflict() απελευθερώνει τον έλεγχο του σύμβολο $, ώστε άλλες βιβλιοθήκες να το χρησιμοποιούν.

Παράδειγμα

Φυσικά, μπορείτε να χρησιμοποιήσετε το πλήρες όνομα αντί της συντομευμένης μορφής για να χρησιμοποιήσετε το jQuery:

$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 依舊運行！");
  });
});

Δοκιμάστε το προσωπικά

Παράδειγμα

Μπορείτε επίσης να δημιουργήσετε τις δικές σας συντομεύσεις. Η μέθοδος noConflict() επιστρέφει την αναφορά στο jQuery, μπορείτε να την αποθηκεύσετε σε μεταβλητή για μελλοντική χρήση. Δείτε αυτό το παράδειγμα:

var jq = $.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 依舊運行！");
  });
});

Δοκιμάστε το προσωπικά

Παράδειγμα

Αν το κείμενο σας χρησιμοποιεί το συντομευμένο $ για το jQuery και δεν θέλετε να αλλάξετε αυτή τη συντομευμένη μορφή, μπορείτε να μεταβιβάσετε το σύμβολο $ ως μεταβλητή στη μέθοδο ready. Ετσι μπορείτε να χρησιμοποιήσετε το σύμβολο $ εντός της συνάρτησης - και εκτός της συνάρτησης, θα πρέπει να χρησιμοποιείτε "jQuery":

$.noConflict();
jQuery(document).ready(function($){
  $("button").click(function(){
    $("p").text("jQuery 依舊運行！");
  });
});

Δοκιμάστε το προσωπικά

Κατανοητικός Οδηγός jQuery

Για πλήρη ανασκόπηση των μεθόδων του jQuery core, επισκεφθείτε το Κατανοητικός Οδηγός jQuery。