web-dev-qa-db-fra.com

Erreur d'interface utilisateur Jquery - f.getClientRects n'est pas une fonction

J'essaie de faire fonctionner l'interface utilisateur de JQuery, mais ce n'est pas le cas. Voici ce qui se passe. Je charge des dépendances:

<script src="assets/src/js/angular/angular.js"></script>
<script src="assets/src/js/angular-animate/angular-animate.js"></script>
<script src="assets/src/js/angular-route/angular-route.js"></script>
<script src="assets/src/js/jquery/dist/jquery.js"></script>
<script src="assets/src/js/jquery-ui/jquery-ui.js"></script>
<script src="assets/src/js/app.js"></script>
<script src="assets/src/js/main.js"></script>

C'est mon fichier main.js:

$(function () {
    $("input[type=submit]")
        .button()
        .click(function (event) {
            event.preventDefault();
        });
});


$(function () {
    $("#circum").buttonset();
});

$(function () {
    $("#dialog-message").dialog({
        modal: true,
        buttons: {
            Ok: function () {
                $(this).dialog("close");
            }
        }
    });
});

Lorsque j'exécute le code dans Brackets, l'interface utilisateur de Jquery est chargée mais ne fonctionne pas. Cependant, lorsque je commente mon fichier main.js puis que je le renvoie, c'est l'erreur que j'ai dans la console et l'interface utilisateur fonctionne soudainement. C'est extrêmement bizarre.

jQuery.Deferred exception: elem.getClientRects is not a function TypeError: elem.getClientRects is not a function
at jQuery.offset (http://127.0.0.1:27530/assets/src/js/jquery/dist/jquery.js:9779:14)
at Object.getWithinInfo (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:1157:26)
at jQuery.$.fn.position (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:1179:23)
at _position (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:8709:17)
at ._position (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:415:25)
at open (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:8334:8)
at .open (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:415:25)
at _init (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:8210:9)
at ._init (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:415:25)
at _createWidget (http://127.0.0.1:27530/assets/src/js/jquery-ui/jquery-ui.js:587:8) undefined

J'ai trouvé ce fil en train de discuter du problème mais je n'ai toujours pas pu le résoudre.

Github

À votre santé.

javascriptjqueryjquery-ui
38
matveytn

Quelle version est votre interface utilisateur jQuery? J'ai eu le même problème avec jQuery UI 1.11.4 et jquery 3.0. Après l'installation de jQuery UI 1.12.0-rc.2, le problème a été corrigé.

60
Vin Shahrdar

L'ajout du plug-in jQuery 3 Migrate résout ce problème comme indiqué ici , une interface utilisateur mise à jour sera bientôt disponible.

LE 5 NOVEMBRE 2018 MISE À JOUR

Si vous utilisez les dernières interfaces utilisateur jQuery et jQuery, utilisez latest jQuery migrate pour éviter les avertissements/problèmes de compatibilité.

29
Mikee

Il s’agit d’une compatibilité entre jQuery 3.x.x et jQueryUI antérieure à 1.12.0.

y compris ci-dessous script résolu le problème pour moi.

https://code.jquery.com/jquery-migrate-3.0.0.min.js

8
Ravi Rajan
> npm remove jqueryui
> npm i -S jquery-ui-dist

Cela téléchargera une version de l'interface utilisateur de JQuery qui peut être incluse directement avec les balises <script>.

0
Slawa

Après avoir fait toutes les mises à jour et malgré le problème, je viens de le corriger dans le code:

Cherchez ceci:

if ( !elem.getClientRects().length ) {
    return { top: 0, left: 0 };
}

Entrez ceci juste avant:

if (!elem.getClientRects()) {
    return { top: 0, left: 0 };
}
0
TheWizardOfTN