Error de jQuery UI – f.getClientRects no es una función

5 minutos de lectura

Error de jQuery UI fgetClientRects no es una funcion
matveytn

Estoy tratando de hacer que jQuery UI funcione, pero no funciona. Esto es lo que sucede.

Estoy cargando dependencias:

<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>

Ese es mi principal.js Archivo:

$(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");
            }
        }
    });
});

Cuando ejecuto el código en Brackets jQuery UI se carga pero no funciona, sin embargo, cuando comento mi main.js archivo y luego traerlo de vuelta, ese es el error que recibo en la consola y la interfaz de usuario está funcionando de repente. Es extremadamente extraño.

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

Encontré este hilo discutiendo el problema, pero aún no pude solucionarlo.

Github

Salud.

  • Estoy pensando que podría ser un problema con Angular, ya que todo funciona bien en un documento nuevo sin él, pero no tengo idea de cuál es el error.

    – matveytn

    20 jun.

  • ¿Puedes compartir el html? o por favor crea un jsfiddle

    – romper

    20 jun.


  • Ponga jQuery y jQuery UI antes de angular en su lista de scripts.

    – Mono hereje

    20 jun.

  • @MikeMcCaughan ¡No puedo creer que sea tan tonto! ¡Lo aprecio mucho! Surgen algunos otros pequeños problemas, pero se pueden solucionar fácilmente. Por lo que sé ahora, Angular entra en conflicto con Jquery UI ya que modifican algunos de los mismos elementos DOM.

    – matveytn

    21 jun.

1641825948 406 Error de jQuery UI fgetClientRects no es una funcion
Vin Shahrdar

¿Qué versión es su jQuery UI? Tuve el mismo problema con jQuery UI 1.11.4 y jQuery 3.0.
Después de instalar jQuery UI 1.12.0-rc.2, se solucionó el problema.

  • Funcionó para mí, gracias, pero aparentemente no funcionó para el m8.

    – Yazsid

    21 jun.

  • No marcó la diferencia en cuanto a qué versión de Jquery UI es, ¡la solución en los comentarios anteriores ayudó! ¡Gracias de todos modos!

    – matveytn

    21 jun.

  • sí, por supuesto, uso un componente que no es compatible con jquery 3.0, cambio la versión de jquery y esos derechos

    – Mohsen

    27/06/2016 a las 12:06


  • Ah, actualizado de 1.11.4 a 1.12.1 y eso funcionó. ¡Gracias!

    – Clox

    09 nov.

  • Esta fue la solucion para mi

    – Hasan Shoman

    16 oct.

1641825948 7 Error de jQuery UI fgetClientRects no es una funcion
Mikee

Agregando el Complemento de migración de jQuery 3 resuelve este problema como se indica aquí, la interfaz de usuario actualizada saldrá pronto.


ACTUALIZACIÓN DEL 5 DE NOVIEMBRE DE 2018

Si usa la última versión de jQuery y jQuery UI, use última migración de jQuery para evitar advertencias/problemas de compatibilidad.


  • migrar Sound Awesome también puede afectar a otros códigos.

    – parlad

    30 abr 2018 a las 5:30

  • Estaba usando Jquery 3+, cambiando a Jquery 1.9.1 con jquery-ui-1.9.2 resolvió el problema 🙂

    – Bimal Das

    17 dic. 18 en 06:19

Resulta que esta es una compatibilidad entre jQuery 3.xx y jQueryUI anterior a 1.12.0.

incluir el siguiente script resolvió el problema para mí.

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

Después de hacer todas las actualizaciones y AÚN teniendo el problema, lo arreglé en el código:

Busca esto:

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

Introduce esto justo antes:

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

Actualicé nuestro sitio heredado, de jquery 1.12 a jquery 3.5 y encontré este mismo problema. El sitio usa jquery-ui 1.10 pero, lamentablemente, la actualización a jquery-ui 1.12 rompió otras cosas, por lo que no pude usar esa opción. Ejecutar el sitio de producción con el complemento de migración se sintió mal, así que miré cómo se solucionó este problema en jquery-ui 1.12.

Parchear jquery-ui 1.10 con la corrección de jquery-ui github “Posición: Proteger contra la ventana de paso a Offset” trabajó para mi.

Esta es una publicación antigua, pero si alguien como yo necesita actualizar sitios heredados, tal vez esta información pueda ser útil.

  • ¿Qué “otras cosas” rompió jQuery-UI 1.12? Estoy haciendo la misma actualización (jQuery 1.12 -> 3.5) y me preguntaba por qué jquery-UI no era compatible con versiones anteriores.

    – gen b.

    15 oct.20 a las 17:16

  • Honestamente, no recuerdo todos los problemas, pero una cosa que se destacó fue el autocompletado en nuestros buzones. Está listado en el guía de migración y aunque parecía fácil de arreglar, resultó ser una tarea demasiado grande con nuestro código heredado.

    – Eben

    16 oct.


> npm remove jqueryui
> npm i -S jquery-ui-dist

Esto descargará una versión de JQuery UI que se puede incluir directamente con <script> etiquetas

  • ¿Qué “otras cosas” rompió jQuery-UI 1.12? Estoy haciendo la misma actualización (jQuery 1.12 -> 3.5) y me preguntaba por qué jquery-UI no era compatible con versiones anteriores.

    – gen b.

    15 oct.

  • Honestamente, no recuerdo todos los problemas, pero una cosa que se destacó fue el autocompletado en nuestros buzones. Está listado en el guía de migración y aunque parecía fácil de arreglar, resultó ser una tarea demasiado grande con nuestro código heredado.

    – Eben

    16 oct.


Error de jQuery UI fgetClientRects no es una funcion
NetVicious

Tuve el mismo problema cuando intentaba obtener la posición X e Y del mouse usando “.pageX/.pageY” en un evento de clic.

Intente cambiar la fuente de las bibliotecas para obtener la última actualización de las mismas, asegurándose de que sean compatibles.

Esos enlaces ahora están funcionando y podrían solucionar los problemas.

.

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad