Question

所以我有一个用悬停处理元素的函数，但是我希望能够将css样式作为参数传递。我尝试了不同的变化，但这是我的代码（只是必要部分）...

function load_hovers(mouseOverCss){
  $('.hover').hover(function(){
    $(this).animate({
      eval(mouseOverCss)
    }, 500, function() {
    });

我打电话给load_hovers("backgroundColor: 'red'");

这会返回错误invalid object initializer $(this).animate({。如果不使用eval，则错误为missing : after property id {eval(mouseOverCss)}\n。

有什么建议吗？

Answer 1

你最好远离Eval选项（Eval是邪恶的，所有......）并尝试将对象传递给你的方法。

首先为CSS参数创建一个对象：

var css = {};
css.Property = 'backgroundColor';
css.Value = 'Red';

然后你可以将这个（或者它们的数组，如果你需要多个属性）传递给你的方法：

function load_hovers(classes)
{
    $('.hover').hover(function(){
      $(this).animate({
        $(this).css(classes.Property, classes.Value); // or iterate over an array of these
      }, 500, function() {
      });
    });
}

Answer 2

得到了它。

var mouseOverCss = {};
mouseOverCss['backgroundColor'] = 'red';
mouseOverCss['paddingLeft'] = '100px';
load_hovers(mouseOverCss);

然后只是

$(this).animate(mouseOverCss, duration);

感谢Phil让我走的路不仅仅是为animate（）发送预格式化的字符串！

将样式作为参数传递给jquery animate

2 个答案: