1

例如,我有以下代码,每行显示 3 个 div 框,页面上有很多行

      <div id='row1col1' class='duty' style="top:50px ; left:50px " ></div>
      <div id='row1col2' class='duty' style="top:50px ; left:150px " ></div>
      <div id='row1col3' class='duty' style="top:50px ; left:250px " ></div>
      <div id='row2col1' class='duty' style="top:150px ; left:50px " ></div>
      <div id='row2col2' class='duty' style="top:150px ; left:150px " ></div>
      <div id='row2col2' class='duty' style="top:150px ; left:250px " ></div>
      <div id='row3col1' class='duty' style="top:250px ; left:50px " ></div>
      <div id='row3col2' class='duty' style="top:250px ; left:150px " ></div>
      etc

我想要做的是动态放置一个新的 div 并根据其上方 div 的 id 或其他属性对其进行更改,我认为这不是父级,所以有什么办法可以获取这些数据?正如我所知道的“顶部”和“左侧”位置,我可以通过这种方式获取 div 的 ID 吗?

请问有什么帮助吗?

4

1 回答 1

0

可能有更好的方法来实现您的目标。但是,这个函数会做我认为你想要的:

function findAbove(selector, x, y) {
    var maxpos = 0, maxel;
    jQuery(selector).each(function(i, el) {
        var $el = jQuery(el),
            ex = parseInt($el.css('left')),
            ey = parseInt($el.css('top'));
        if (ex < x && ey < y && ex + ey > maxpos) {
            maxpos = ex + ey;
            maxel = $el;
        }
    });
    return maxel;
}
// Pass the coordinates of the new div
findAbove('.duty', 250, 250).css('border','2px solid green');

如果您知道您的新 div 将与其上方的 div 完全对齐,那么您应该更改ex < xex == x,并ex + ey(两次)更改为ey

于 2013-02-23T22:05:17.380 回答