No puedo entender el error en este jQuery

Question

La página que tiene problemas es ... http://schnell.dreamhosters.com/index.php?page=gallery#

Utilizo Firebug para depurar mi jQuery y otros tidbits de código y me ha resultado muy útil para la depuración de Javascript / jQuery. Sin embargo, al mismo tiempo, ha sido una de las experiencias de depuración más frustrantes por las que he pasado. No estoy seguro de por qué, pero a veces parece que puedo copiar la metodología de otra persona de un tutorial, personaje por personaje, y aún así encontrar errores.

En cualquier caso, el problema aquí es que Firebug afirma que hay un error en la línea 20 de la fuente.

falta: después de la identificación de la propiedad [Romper en este error] $ ('# tabla'). Animate ({" left: " + attr + " px "}, 2000); \ n

¡Este error me parece una gran carga porque los dos puntos están ahí ! Y esta es la razón por la cual la depuración de jQuery / Javascript es tan difícil a veces. Los mensajes de error son bastante complicados y, a veces, ni siquiera tienen sentido para mí. O tal vez eso es solo Firebug.

De cualquier manera, el objetivo al que me dirijo aquí es que estoy tratando de cambiar dinámicamente la función animada de modo que cuanto más haga clic en la flecha izquierda, más a la izquierda se desplazará la cuadrícula de imágenes (debido a la naturaleza de la propiedad 'izquierda' de CSS). Tengo variables Javascript y una etiqueta de entrada oculta para ayudar a mantener los valores esenciales, pero el obstáculo principal es lograr que la función animada reconozca estas variables. Por lo que puedo decir, solo aceptará literales de cadena para argumentos sobre cómo animar y la documentación no me ayuda porque no discute el uso de variables con animación, como si fuera imposible.

Bueno, digamos que no me gusta lo imposible, a él le gusta meterse en mi camino mucho.

Answer 1

El objeto literal pasado a la función animada no está bien formado, debería ser:

$('#table').animate({left: attr + "px"}, 2000);

Editar : mirando de cerca a su código, también está tratando de obtener un valor de una entrada con id = " count " ;, y le falta un carácter # para tener un selector de ID:

var count = +$('#count').val(); // get #count value as Number

También está incrementando esta variable count , pero primero debe convertirla en Number, porque el atributo value de los elementos input son cadenas . ( Lo hice usando el operador unario más en el lado derecho de la tarea ).

Debe convertirlo en un número, porque si agrega dos variables y una de ellas es una cadena, se producirá una concatenación:

 "1" + 1 == "11"

Answer 2

Prueba:

$('#table').animate({left: attr}, 2000);

El " px " Las unidades de medida aquí no son necesarias. Aparte de eso, lo anterior es la creación correcta de un objeto anónimo. Simplemente estabas poniendo una cuerda dentro de llaves.