[jquery-ui] I suggerimenti di jQueryUI sono in competizione con Twitter Bootstrap



Answers

Una soluzione semplice è caricare bootrap.js dopo jquery-ui.js, in modo che il metodo bootstrap .tooltip abbia la precedenza.

Question

Sono stato in grado di ottenere alcuni suggerimenti sugli strumenti per lavorare finalmente con il seguente codice:

<a href="#" rel="tooltip" title="Tool tip text here">Hover over me</a>

e poi

<script>
    $('[rel=tooltip]').tooltip();
</script>

Il problema che sto incontrando è che sta usando i tooltips di jQueryUI (niente frecce, grandi brutti tooltip) invece di Bootstraps.

Cosa devo fare per utilizzare le descrizioni di Bootstrap invece di jQueryUI?




prova ad usare jQuery.noConflict() e vedi se questo ti aiuta affatto. Sembra bootstrap e jQuery usa lo stesso spazio dei nomi, e forse i toolstrap bootstrap e jQuery vengono caricati nella stessa funzione, o uno viene caricato per primo.

Puoi anche controllare per vedere quale libreria è stata caricata per prima. Di solito se dichiari la stessa funzione due volte in javascript, la seconda è quella che viene utilizzata.

In terzo luogo, controlla il pacchetto jQueryUI ( website e vedi se riesci a scaricare una versione che non ha i tooltip inclusi (ho controllato e questo è totalmente fattibile).




Un modo semplice è caricare bootstrap.js dopo jquery-ui.js, in modo che bootstrap .tooltip sovrascriva le interfacce utente di jquery. Se stai usando un caricatore di moduli come requirejs, potresti rendere bootstrap dipendente da jquery-ui, in quanto tale:

requirejs.config({
    baseUrl: 'js',
    waitSeconds: 30,
    shim: {
        'bootstrap': {
            deps: [ 'jquery', 'jquery-ui' ]
        },...



Questa soluzione sembra funzionare bene per me.

// handle jQuery plugin naming conflict between jQuery UI and Bootstrap
$.widget.bridge('uibutton', $.ui.button);
$.widget.bridge('uitooltip', $.ui.tooltip);



Supponendo che l'interfaccia utente chiamerà dopo l'inizializzazione di bootrap

Memorizza la funzione bootstrap appena prima che l'interfaccia utente venga inizializzata

jQuery.fn.bstooltip = jQuery.fn.tooltip; 

Quindi chiamalo come segue

$('.targetClass').bstooltip();





Related