1

2 つのフォルダーに画像があります。1 つはtne名前付きフォルダーにあり、もう1 つは名前付きフォルダーにあり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....

そして、画像はこのように1つのdivにあります....

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

質問：

oneここで、名前が付けられた最初のフォルダーの合計画像の幅と、名前が付けられた2番目のフォルダーの合計画像の幅を知りたいtwo

jqueryで可能ですか？

4

3 に答える 3

1

これでうまくいくはずです：

jsフィドル

    $(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]);
});

これはもう少し高度ですが、最初の 2 つの配列にさらに要素を挿入するだけで、苦労せずに拡張することができます。

EDIT 'sports' と 'cats' はもちろんフォルダの例にすぎないことを忘れていました。あなたの場合、「image/one」と「image/two」を入れる必要があります。この状況では本当に必要ではないため、これも jQuery をほとんど使用しません。

于 2013-09-17T12:59:09.097 に答える
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 に答える
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 に答える