1

我在两个文件夹中有图像。一个在tne命名文件夹中，另一个在two命名文件夹中。

/images/one/one.jpg
/images/one/two.jpg
/images/one/any.jpg
and more....


/images/two/any.jpg
/images/two/what.jpg
/images/two/ever.jpg
/images/two/images.jpg
and more....

图像像这样在一个 div 中....

<div id="test">
<img src="/images/one/...." />
<img src="/images/one/...." />
<img src="/images/two/...." />
<img src="/images/two/...." />
</div>

问题：

现在我想知道命名的第一个文件夹one的总图像的宽度和命名的第二个文件夹的总图像的宽度two

用jquery可以吗？

4

3 回答 3

1

这应该为您解决问题：

jsFiddle

    $(document).ready(function(){
    var dirs = ['sports','cats'];
    var widths = [0,0]; //Index 0 is width of images in folder 1 and index 1 is width of images in folder 2
    for(var i=0;i<dirs.length;i++) {
        $('img').filter(function(){
            if($(this).attr('src').indexOf(dirs[i])>=0)
            {
                widths[i] = widths[i]+$(this).width();
            }
        });
    }
    alert('Total width 1: '+widths[0]+', total width 2: '+widths[1]);
});

它更高级一点，但可以毫不费力地扩展，只需在前两个数组中插入更多元素即可。

编辑 忘了提到“运动”和“猫”当然只是示例文件夹。在您的情况下，您需要输入“image/one”和“image/two”。这也使用了非常少的 jQuery，因为在这种情况下它并不是真正的必需品。

于 2013-09-17T12:59:09.097 回答
0

尝试这个：

var totalImagesFolderOne = 0;

$("div#test > img[src*='/images/one/']").each(function(){
  totalImagesFolderOne += $(this).width();
});

alert("Total width images in folder `one`: " + totalImagesFolderOne);

这是一个jsFiddle

于 2013-09-17T12:36:21.967 回答
0

您可以wrapAll()在 jquery 中使用函数：

var allWidth = $('#test img').wrapAll('<span>').parent().width();
var oneWidth = $imgOne.wrapAll('<span>').parent().width();
var $imgOne = $("div#test img[src*='/images/one/']");
$('#test img').unwrap();
$imgOne.unwrap();

console.log(oneWidth) //one images width
console.log(allWidth - oneWidth) //two images width.
于 2013-09-17T12:46:30.893 回答