如何将两个变量设置为一个答案

【问题标题】：How to set two variables as one如何将两个变量设置为一个
【发布时间】：2013-03-06 15:13:53
【问题描述】：

我有这个问题，但我找不到任何激进的答案......

那么，有没有可能用 jQuery 将两个变量设置为一个，像这样：

    var $self = {
        car_img_stage: $('.car_img_stage'),
        vis_home: $('#vis_home')
    }

然后像这样使用：

    $self.animate({
        'margin-left': '-1200px'
    }, 600)

谢谢帮助。

【问题讨论】：

如果不将 $.fn 中的所有方法复制到您的对象并让它对每个方法执行一些额外的逻辑以确保目标正确的元素，就无法完成您的要求当您使用$self.animate() 时。只需将它们缓存在两个单独的变量中，当你想影响两者时，使用one.add(theother).dosomething()
好的，但是，我可以将它们设置在某种数组中吗？像这样：var car_img_stage = $('.car_img_stage'), vis_home = $('#vis_home'); 并在var self = $[vis_home,car_img_stage]; 之后使用？
否，因为无法从 jQuery 对象数组创建 jQuery 对象。它们每个都必须转换为一个 dom 元素，例如，var car_img_stage = $('.car_img_stage').get();
好的，谢谢你的解释
好的，我找到了这个：var self = jQuery.makeArray(vis_home,car_img_stage);，它工作得很好

标签： javascript jquery arrays variables

【解决方案1】：

你可以创建一个组合选择器来完成同样的事情：

$self = $('.car_img_stage,#vis_home');

【讨论】：

但我可以在某些操作后使用其中一个吗？这就是为什么我设置如下
很抱歉，你的英文不好。我不清楚你想要实现什么。

【解决方案2】：

有几种方法可以做到这一点 -

Multiple selectors

$self = $('.car_img_stage,#vis_home');

jQuery add

//basic use
$self = $('.car_img_stage').add('#vis_home');

它们的动画方式相同：

$self.animate({
    'margin-left': -1200
}, 600);

如果您想缓存选择器并在以后单独使用它们，添加也很有用。

//cached selectors
$car_img = $('.car_img_stage');
$vis_home = $('#vis_home');
$self = $car_img.add($vis_home);

$car_img.animate({
    'color': 'red'
}, 600);

$vis_home.animate({
    'height': 200
}, 600);

$self.animate({
    'margin-left': -1200
}, 600);

你也可以让你的选择器保持原样并循环通过它。不推荐这种方式，但在技术上可行。

var $self = {
    car_img_stage: $('.car_img_stage'),
    vis_home: $('#vis_home')
}

for (var each in $self){
    $self[each].animate({
        'margin-left': -1200
    }, 600);
}

下一个注释与原始问题无关，但在处理多个选择器动画时要记住这一点。

请注意，当为多个选择器设置动画时，附加的任何回调都将针对 EACH ITEM ANIMATED 触发。当说，淡出链接列表（而不是包含它们的包装器）或类似的东西时，这是相关的。为避免此问题，您可以使用a promise，如下所示：

$self = $('.car_img_stage,#vis_home');

$self.animate({
    'margin-left': -1200
}, 600, function(){
    //callback code here to happen for every animated element.
}).promise().done(function(){
    //callback code here, to happen once when ALL animations are complete.
});

您可以省略这些回调函数中的一个或两个：

只是一个回调：

$self.animate({
    'margin-left': -1200
}, 600, function(){
    //callback code here to happen for every animated element.
});

只是一个承诺：

$self.animate({
    'margin-left': -1200
}, 600).promise().done(function(){
    //callback code here, to happen once when ALL animations are complete.
});

【讨论】：

添加了一个与您有关拥有单独选择器的问题相关的部分。

【解决方案3】：

你可以这样做：

var some_things = $('.car_img_stage, #vis_home');

some_things.animate({
    'margin-left': '-1200px'
}, 600)

【讨论】：

在变量之前使用$可以清楚地将它们区分为jQuery对象。虽然我自己一般不会这样做，但这种做法并不少见。
self 遮蔽了全局 window.self，这不是一个好的变量名称。

【解决方案4】：

作为我的补充回答，我找到了一些其他的解决方案，而且它的工作。

var car_img_stage = $('.car_img_stage'),
    vis_home = $('#vis_home');

var self = jQuery.makeArray(vis_home,car_img_stage);

和行动

self.animate({
    // some animate action
}, 600);

【讨论】：

正如 jbabey 上面指出的，你真的不想在这里使用“self”作为你的变量名。
删除了我以前关于它不起作用的 cmets。它在这里工作的例子 - jsfiddle.net/kcN5p/1