Question

我遇到了问题here没有解决方法：我不能对动态生成的元素使用stopPropagation（）。

我尝试创建一个条件来排除衍生元素维度内的点击，但这似乎根本不起作用。

这是我得到的：

1）一个大的背景元素（“画布”）被一个按钮激活为“对其点击敏感”

2）画布如果被激活，将捕获所有点击并在其中生成一个小的子表单（“child”）

3）孩子相对于鼠标点击位置定位。如果鼠标单击位于画布的右半部分，则子项将位于该点左侧200像素处。（如果点击位于左半部分，则在右侧）

4）画布上的每次新点击都会删除现有的子项（如果有的话）并在新位置生成一个新子项（相对于点击）

问题：由于衍生的子元素位于画布顶部，因此单击它会将其视为画布上的单击。即使孩子在画布的边界之外，点击它也会再次触发4）中描述的动作。这不应该发生。

===========代码：用于激活画布的按钮：

$('a#activate').click(function(event){
    event.preventDefault();
    canvasActive(); 
});

我引用了上面的内容，向您展示了一个函数正在进行画布点击捕捉。不确定这是否相关......

这是捕获画布上点击的功能：

function canvasActive() {
    $('#canvas').click(function(e){
        e.preventDefault();

        //get click position relative to canvas
        posClick = {
            x : Math.round(e.pageX - $(this).offset().left),
            y : Math.round(e.pageY - $(this).offset().top)
        };

        //calculate child position
        if(posClick.x <= $canvas.outerWidth(false)/2) {
            posChild = {
                x: posClick.x + 200, //if dot is on the left side of canvas
                y: posClick.y
            };
        } else {
            posChild = {
                x: posClick.x - 600, //if dot is on the right
                y: posClick.y
            };
        }

        $(this).append(markup); //markup is just the HTML for the child

    });
}

我遗漏了不重要的东西。问题是：

如何防止生成的子项内部的单击执行该函数？我尝试了孩子的尺寸并做了类似“如果posClick在这个范围内，不做任何事情”的事情 - 但我似乎无法做到正确。

也许有人之前遇到过这种困境。任何帮助表示赞赏。

Answer 1

我实际上没有看到任何jQuery .live()代码。使用bind，click等添加的常规活动不是“实时”活动。

在任何情况下，你需要做的就是检查was passed into事件的项目，看看它是否是画布：

$('#canvas').click(function(e){
    if($(this).is('#canvas')){
      // it really was the canvas that was clicked!
      // could also check "e.currentTarget"--it's the same as "this"
      // do your thing and return false
    }
}

使用live（）停止传播的解决方法？

1 个答案: