1

我有一个元素单击事件，单击一次会触发两次，这是搜索中的常见问题，但我已经排除了其他答案的潜在原因。代码是

console.log("registering label click");
$("label.tiletype").click(
  function(event) {
    event.stopPropagation(); // stop the .tile click being called
    console.log("label clicked, x = " + event.pageX + ", y = " + event.pageY);
    // more code...
  }
}

当页面加载并单击“label.tiletype”时，日志为

registering label click
label clicked, x = 679, y = 172
label clicked, x = 679, y = 172

由于“注册标签点击”只发生了一次，因此不能以任何理由将点击绑定两次。

由于 pageX 和 pageY 坐标相同，双事件发生在同一次物理点击中，而不是在元素上调用第二次编程 click() （我认为，如果错误，请纠正我）。

调试行仅在此特定代码位中，因此不会触发其他单击事件。

我在 Firebug 中检查了源代码，有多个“label.tiletype”元素，但屏幕上没有重叠，它们都是 display:block 和 float:left。

JavaScript 文件中发生了其他事情（第 375 行https://github.com/okohll/agileBase/blob/200dd1c6c1a8968bc9d8f5b2b3d9188ac4776984/gtpb_clientside/resources/simple/simple.js）但无论发生什么其他事情，上述语句必须始终逻辑上正确。

这在 Firefox 和 Safari 中都会发生。

我错过了什么？

JSFiddle：http: //jsfiddle.net/okohll/cKgAp/

4

4 回答 4

4

根据这个网站，双重使用$(document).ready可能是原因。尝试通过首先取消绑定你的函数来避免它：

$('label.tiletype').unbind('click').bind('click',
function(event) {
  event.stopPropagation(); // stop the .tile click being called
  console.log('label clicked, x = ' + event.pageX + ', y = ' + event.pageY);
  // more code...
}
于 2013-03-30T23:10:52.867 回答
2

啊，找到了！该标签内部包含一个输入，其中一个事件是由于单击该传播而引起的。

添加

$("label.tiletype input").click(function(event) {
  event.stopPropagation();
});

到http://jsfiddle.net/okohll/cKgAp/

修复它。感谢您提示做一个 jsfiddle，我最初以为我无法复制它。

于 2013-03-30T23:31:17.557 回答
1

您的代码中有语法错误，应该是

console.log("registering label click");
$("label.tiletype").click(function(event) {
    event.stopPropagation(); // stop the .tile click being called
    console.log("label clicked, x = " + event.pageX + ", y = " + event.pageY);
    // more code...
});

但是此代码按预期工作（仅触发一个“标签单击”消息）。因此，您可能应该检查其余代码或 HTML 代码的有效性（例如，未闭合的标签可能会导致此行为）。

于 2013-03-30T23:10:48.467 回答
0

您可以使用on()

$("label.tiletype").on('click', function (event) {
   alert("label clicked, x = " + event.pageX + ", y = " + event.pageY);
});

http://jsfiddle.net/cKgAp/6/

于 2013-03-30T23:57:50.520 回答