Question

作为一个例子我有以下代码，每行显示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吗？

请帮忙吗？

Answer 1

可能有更好的方法来实现目标。但是，这个功能会做我认为你想要的：

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 < x更改为ex == x，并将ex + ey（两次）更改为{{ 1}}。

从坐标中获取DIV id

1 个答案: