¿Cómo pasar la variable a las propiedades de la función jquery animate?

Question

function SlideObject(Side) { 
    $("#div").animate({ 
     margin+Side: "-1000px", 
     opacity: "hide" 
    }, 1000); 
} 

Me gustaría pasar el valor de "Lado" en el nombre del identificador de propiedad (margen) para la función animada.

Soy consciente de que "margin + Side" no es válido, solo está allí como un marcador de posición. Por ejemplo, si tuviera que especificar el nombre de propiedad manualmente, podría ser "marginLeft" para nombrar un ejemplo. Me gustaría proporcionar "Izquierda", "Derecha", "Superior" o "Inferior" como el parámetro para la función SlideObject.

Estoy teniendo problemas para hacer esto y un ejemplo sería maravilloso.

Gracias

Answer 1

En primer lugar, No uso eval() para hacer esto. No es necesario y eso abre su sitio a las vulnerabilidades si de alguna manera está utilizando la entrada del usuario como parte de eso (directa o indirectamente). La forma correcta de hacerlo es:

<div id="div">This is a test</div> 

con CSS:

y Javascript:

function slideObject(side) { 
    var anim = {opacity: 0}; 
    anim["margin" + side] = "-1000px"; 
    $("#div").animate(anim, 1000); 
} 

$(function() { 
    slideObject("Left"); 
}); 

Se habrá dado cuenta de que se cambia el valor a 0. opacity se hide no es un valor válido para opacity.

Básicamente, usted crea el objeto anónimo y luego asigna una propiedad dinámica usando [].