确定浮动元素中的换行位置

假设我有六个<div>容器内的元素<div>。这六个 div 中的每一个都是一个正方形并且具有 CSS 样式float: left应用。默认情况下，当它们到达容器的边缘时<div>他们会包裹起来。

现在，我的问题是，使用Javascript，是否可以确定换行在哪个元素？

如果它们在页面上显示如下：

 ___   ___
| 1 | | 2 |
----- -----
 ___   ___
| 3 | | 4 |
----- -----

我试图确定换行发生在第二个和第三个元素之间。如果您想知道我是否失去了理智，我尝试这样做的原因是如果单击其中一个框，我希望能够使用一些奇特的 shmansy jQuery 在行之间下拉一个信息区域。

 ___   ___
| * | | ! |
----- -----
| Someinfo|
 ___   ___
| * | | * |
----- -----

关于确定中断发生位置有什么想法吗？

附：我浮动并让它自动换行的原因是为了使其具有响应能力。现在，如果我调整浏览器的大小，它会相应地包裹盒子。我不想对列宽度进行硬编码。

[EDIT]感谢爆丸提供的答案，我才找到了解决办法。

// Offset of first element
var first = $(".tool:first").offset().left;
var offset = 0;
var count = 0;

$(".box").each(function () {

   // Get offset            
   offset = $(this).offset().left;

   // If not first box and offset is equal to first box offset
   if(count > 0 && offset == first)
   {
      // Show where break is
  console.log("Breaks on element: " + count);
   }

   // Next box
   count++;
});

这会在控制台中输出以下内容：

Breaks on element: 7 
Breaks on element: 14
Breaks on element: 21
Breaks on element: 28 

当我有 30 个盒子时，最终变成 7 个盒子宽、5 排（最后一排只有 2 个盒子）

只需将容器的宽度除以盒子的宽度即可。
(假设正方形宽度相等..)

这将选择每行的最后一个元素

var wrapper = $('.wrapper'),
    boxes = wrapper.children(),
    boxSize = boxes.first().outerWidth(true);

$(window).resize(function(){
    var w = wrapper.width(),
        breakat = Math.floor( w / boxSize); // this calculates how many items fit in a row 

    last_per_row = boxes.filter(':nth-child('+breakat+'n)') // target the last element of each row
    // do what you want with the last_per_row elements..
});

Demo at http://jsfiddle.net/gaby/kXyqG/