【问题标题】:Identify all elements present at specified position识别出现在指定位置的所有元素
【发布时间】:2013-05-22 13:59:36
【问题描述】:

jQuery 中是否有任何方法可以选择位于特定位置的所有元素,例如选择位于 left:100 和 top:300 的元素以及另一个 div 位于同一位置的元素,单击时我想获取 ID两个 div 的?

如果我可以选择和元素位于一系列位置,那就太好了,

http://jsfiddle.net/simmi_simmi123/YjC6y/1908/

这个 Fiddle 但它只显示顶部 div 的 ID。

$(document).ready(function(){        
    $(document.body).bind('click', function(e){
        var elem = document.elementFromPoint(e.pageX, e.pageY);

        alert('you selected element id: ' + elem.id);
    });
});

【问题讨论】:

标签: jquery css html


【解决方案1】:

试试我的小提琴http://jsfiddle.net/YjC6y/1911/

它使用您原始帖子中评论的可能重复的代码:

$(document).ready(function(){        
    $(document.body).bind('click', function(e){
        var elems = GetAllElementsAt(e.pageX, e.pageY);

        elems.each(function() {
            alert($(this).attr('id'));
        });
    });
});

function GetAllElementsAt(x, y) {
    var $elements = $("body *").map(function() {
        var $this = $(this);
        var offset = $this.offset();
        var l = offset.left;
        var t = offset.top;
        var h = $this.height();
        var w = $this.width();

        var maxx = l + w;
        var maxy = t + h;

        return (y <= maxy && y >= t) && (x <= maxx && x >= l) ? $this : null;
    });

    return $elements;
}

这篇文章的主要作者@hunter:find elements that are stacked under (visually) an element in jquery

【讨论】:

    【解决方案2】:

    类似的东西-

    $('*').filter(function () {
        if ($(this).position().left === 100 && $(this).position().top === 300)
          return true;
        else
          return false;
    }).each(function () {
        console.log($(this).attr('id'));
    });
    

    演示--&gt;http://jsfiddle.net/YjC6y/1910/

    【讨论】:

    • 如果我将指针移动到“anam”div 上,我想显示“one”(div id)的警报...您的代码正在计算所有 div 的数量
    • 你必须点击元素的左上角。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-06-29
    • 1970-01-01
    • 2022-10-16
    • 2016-02-09
    • 2011-02-11
    相关资源
    最近更新 更多