0

这是一个关于用 jquery 匹配分割宽度的问题。这是我正在使用的 html 代码。

<ul class="thumbs_container">
<li class="thumbs">
    <a class="fancybox" href="" >
        <div class="thumbs_image_container">
            <img src="" />
        </div>
        <div class="caption">
            caption
        </div>
    </a>
</li>
    <li class="thumbs">
    <a class="fancybox" href="" >
        <div class="thumbs_image_container">
            <img src="" />
        </div>
        <div class="caption">
            caption
        </div>
    </a>
</li>
</ul>

我将有多个带有“thumbs”类的列表项。我想要做的是将具有“标题”类的 div 的宽度与具有“thumbs_image_container”类的 div 的宽度相匹配，但分别处理每个列表项。

有人可以给我一些关于如何做到这一点的指示吗？我知道如何匹配宽度，但是在弄清楚如何分别处理每个列表项时遇到了问题。

4

3 回答 3

0

使用 jQuery each（Jquery $.each 选择器）

此代码将获取带有类 thumbs 的元素集，然后检查每个元素是否包含名为 caption 的类，如果该元素确实包含标题，则它采用 class = thumbs_image_container 元素上的相关宽度并将其应用于迭代元素。

$('.thumbs').each(function( location, element ){
 if( $(this).find('.caption').length){  
  var w = $(this).find('.thumbs_image_container')[0].width();
  $(this).width(w);
 }
});
于 2012-10-25T21:41:22.100 回答
0

尝试使用 $.each()

var $ulWidth = $('thumbs_container').width();

$('li.thumbs').each( function() {

      var $divWidth = $(this).find('div.caption').width(); //Width of div inside Current li..

      if( parseInt($ulWidth) == parseInt($divWidth) ) {
           // Do Something
      }
});
于 2012-10-25T21:42:34.617 回答
0

感谢 Sushanth 和 Travis，jquery 每个人都成功了，经过试验，这就是我最终想要做的事情，

$('li.thumbs').each( function() {
var $divWidth = 0;  
$divWidth = $(this).find('img').width(); 
$(this).find('div.caption').width($divWidth);
});

事实证明，这是我需要匹配“标题”宽度的图像宽度。

谢谢您的帮助

于 2012-10-25T22:20:39.597 回答