Question

当用户更改给定的change元素时，我有一个jQuery SELECT事件。但是，事件也可能由第三方脚本触发。我想要做的是检测事件是以编程方式还是由用户触发。

我在这个问题中尝试过接受的解决方案Check if event is triggered by a human 但请注意，此答案中的JSFiddle是针对click事件而非change事件。

为了证明我修改了小提琴并创建了这个：http://jsfiddle.net/Uf8Wv/231/

如果您在最新的Firefox或Chrome中尝试此功能，即使以编程方式触发事件，您也会看到警告human正在显示。

我尝试了event.originalEvent.isTrusted，但这并不适用于所有浏览器。有人可以帮忙吗？

Answer 1

我添加了mouseenter和mouseleave事件。这个想法是，如果点击与鼠标指针在元素上方重合，那么它就是人类。看到： http://jsfiddle.net/Uf8Wv/232/

$("#try").mouseenter(function(event) {
    mouseover = true;
});
// ... etc.

我想不出任何其他方式。

Answer 2

您可以轻松检测按钮上的点击事件是否实际上是通过鼠标点击触发的。通过这样做，

$('#click').click(function(ev) {
    if (ev.which !== undefined && ev.button !== undefined) {
        $("#try").click();
    }
});

这里是Fiddle

注意：注意ev.which或ev.button可能导致某些浏览器上的0左键单击。

Answer 3

您可以检查event.srcElement（触发事件的源元素）是否等于event.currentTarget类似：

$("#try").change(function(event) {console.log(event,event.target,event.currentTarget,event.srcElement)
    if (event.currentTarget=== event.srcElement) {
        alert(' human')
    } else {
        alert(' not human');
    }
});

小提琴：http://jsfiddle.net/Uf8Wv/234/

Answer 4

您可以使用以下代码找到点击和模拟点击之间的一些模糊差异：

$(document).on('change', "#try", function (event) {
    //some difference appear in the next line
    console.log(event.delegateTarget.activeElement);
    //no difference
    if (event.originalEvent === undefined) {
        alert('not human')
    } else {
        alert(' human');
    }
    event.delegateTarget = null;//doesn't help

});

$('#click').click(function (event) {
    $("#try").click();
});

点击复选框日志<input id="try" type="checkbox"> 点击按钮日志<button id="click"> 但是......
在任何点击记录$("#try").click();之前和最后一次点击的点击结果之后，从控制台运行<body> 通常JS总是伪造任何客户端事件。所以isTrusted永远不会被信任。

Answer 5

您也可以收听点击事件，并修改变量。更改事件似乎确实非常类似于真正的点击或脚本触发的点击，但点击 #try 事件不会是一样的。由于点击是在更改之前触发的，因此您有时间设置切换。像这样举例如：

var realClick;
$("#try").change(function(event) {
  console.log('change')
  if (!realClick) {
    alert('not human')
  } else {
    alert(' human');
  }

}）;

$("#try").click(function(event) {
  console.log('click')
  // originalEvent is one way, but there will be many differences
  if (event.originalEvent) {
    realClick = true;
  } else {
    realClick = false;
  }
});

// Since this is called from outside, better not put 
// any controls here.
$('#click').click(function(event) {
  $("#try").click();
});

http://jsfiddle.net/2xjjmo09/3/

Answer 6

真正为我工作的是：

if ((event.originalEvent.isTrusted === true && event.originalEvent.isPrimary === undefined) || event.originalEvent.isPrimary === true) {
    //Hey hooman it is you
    //Real CLick
}

使用最新的jQuery版本

jQuery - 检测以编程方式触发的更改事件

6 个答案: