为两个ID设置一个变量的正确语法

correct syntax for setting one variable for two IDs

本文关键字：变量 一个 语法 设置 两个 ID      更新时间：2023-09-26

我有这个变量

var item_width = $('#slides li').outerWidth();

并且希望将其修改为也包括CCD_ 1。我必须写两个var并在它们各自的函数中使用它们吗？或者有没有一种方法可以在一行中包含这两个ID？

我这样做是因为我有两个div（切换），其中包含两个不同的幻灯片转盘，并试图共享尽可能多的脚本。

//编辑以推断//

我在这里遗漏了一些简单的东西，我知道。第一个div没问题，第二个就是不起作用。我应该使用类吗？（这可能是一个愚蠢的问题，但我对JS非常陌生）

有相当多的代码，我无法让jsfiddle工作，所以我只是在我们的生产网站上发布了一个开发文档。

（url已删除）

//编辑//

别介意，问题出在css上，而不是脚本上。将CCD_ 2添加到CCD_。它们都漂浮在ul 的左侧

var item_width = $('#slides:visible li,#slides2:visible li').outerWidth();

如果您想要所选元素的outerWidth()s的数组。。。

$('#slides li, #slides2 li').map(function() { return $(this).outerWidth(); });

outerWidth()将只返回单个Number（或null）。

您可以使用逗号构造一个引用两个"幻灯片"的jQuery对象：

var item_width = $('#slides li,#slides2 li').outerWidth();

然而，你可能会发现这不是你想要的，因为它只会给出匹配1的第一个元素的外部宽度。

所以，即使它不仅仅是一行，也许你想要的是：

var item_width = 0;
$('#slides li,#slides2 li').each(function () {
    item_width += $(this).outerWidth();
});

而你可以更简单地使用：

var item_width = $('#slides li').outerWidth() + $('#slides2 li').outerWidth();

前一个版本的代码允许您以后更容易地扩展代码。正如其他人所建议的那样，您可以考虑为每张幻灯片<li>（如"slideItem"）分配一个公共类，然后使用以下代码来获得所有幻灯片的总宽度，无论有多少：

var item_width = 0;
$('.slideItem').each(function () {
    item_width += $(this).outerWidth();
});

现在，您可能正在寻找最大宽度，而不是总宽度，在这种情况下，代码可以很容易地更改以满足您的需求：

var max_width = 0;
$('.slideItem').each(function () { //modify the selector to suit your needs.
    max_width = Math.max(max_width, $(this).outerWidth());
});

为了简化选择两个不同的幻灯片，建议确保它们共享一个公共类。在这种情况下，请尝试将类#slides2 li0添加到这两个类中。

var $allSlides = $('.slides');

由于.outerWidth()只返回集合中第一个元素的宽度，因此可能需要对这些元素进行迭代并执行相同的操作。

$allSlides.each(function(index, element) {
    var $this = $(this),
        outerWidth = $this.outerWidth();
    doSomething($this);
});
相关文章：