2013-02-10 7 views
9

Gibt es eine Methode, mit der ich feststellen kann, ob ein Benutzer einen Tastenklick ausgeführt hat und nicht eine automatisierte Methode (JavaScript), die ein Benutzer in seinen Browser geladen hat Konsole oder andere Browser-Entwickler-Tool?Ermitteln, ob die Schaltfläche auf einen realen Benutzer klickt oder durch ein Skript ausgelöst wird

Ich habe versucht, die folgenden Methoden in verschiedenen Stackoverflow-Beiträge vorgeschlagen, aber keiner von ihnen scheint zu funktionieren. REF: How to detect if a click() is a mouse click or triggered by some code?

Script Nachweismethoden versucht und sind gescheitert:

mybutton.click(function (e) { 
    if (!e.which) { 
     //Triggered by code NOT Actually clicked 
     alert(' e.which - not a real button click') 
    } else if ('isTrusted' in e && !e.isTrsuted) { 
     //Triggered by code NOT Actually clicked 
     alert(' e.isTrusted - not a real button click') 
    } else if (e.originalEvent === undefined) { 
     //Triggered by code NOT Actually clicked 
     alert(' e.originalEvent - not a realbutton click') 
    } 
    //     else if (!e.focus) { 
    //      //triggered // does not detect e.focus on a real btn click 
    //      alert(' e.focus - not a realbutton click') 
    //     } 
    else { 
     // Button hopefully clicked by a real user and not a script 
    } 
}) 

Wenn ich das folgende Skript ausführen, um die Schaltfläche können Sie vom Chrome-Browser-Konsole keine der oben genannten Methoden Fallen sie auslösen, wie durch eine ausgelöste Skript.

var button = document.getElementById("btnSubmit"); 
button.click(); 

=========================================== ==========================

Vielen Dank für alle Ihre Antworten und Dank Stackoverflow für die Bereitstellung einer so großen Website, die so viel Wissensaustausch ermöglicht und uns Technikfreaks eine ungezählte Anzahl von Stunden spart.

Es scheint, dass ich immer noch keine zuverlässige Methode habe. Alle 3 Browser (FF, IE & Chrome) bieten eine Entwickler/Konsole-Schnittstellen für einen Benutzer zum Ausführen/injizieren ein Javascript auf meiner Webseite. Es scheint, dass jede Browser-Variante einige Ereigniseigenschaftswerte etwas anders erfasst. Beispiel: Chrome erfasst den Unterschied zwischen einem Skript-aktivierten Cick und einem echten Benutzer mit e.screenX, aber im IE: e.screenX hat denselben Wert sowohl für einen Skriptklick (synthetisch) als auch für eine Benutzerschaltfläche

Folgendes Die Erkennungsmethoden funktionierten entweder überhaupt nicht oder waren in den verschiedenen Browsern inkonsistent: e.Wie e.isTrsuted e.originalEvent (event.source! = window) (e.distance! = null)

Das mousedown-Ereignis scheint zu nur durch einen echten Benutzer Button Klick ausgelöst werden, aber ich muss davon ausgehen, gibt es einige Skript-Methode, um einen Mausklick zusätzlich zu einem Button Click-Ereignis zu emulieren

$ (me.container + '.mybutton'). mousedown (Funktion (e) {alert ('mausisdown real button click'); }

Wenn jemand eine zuverlässige Methode herausfinden kann, die über mehrere Browser hinweg funktioniert, die den Unterschied zwischen einem synthetischen (Skript) -Knopfklick und einem Knopfklick durch einen Benutzer erkennt, verdienen Sie den Superheldenstatus.

+0

Ab jetzt kann ich nicht eine akzeptierte Antwort sehen. Und schlimmer noch, nicht eine, die ich akzeptieren würde. –

+1

Für firefox e.isTrusted arbeitet, weiß nicht für andere. ** e.isTrsuted ** funktioniert nicht ;-) –

Antwort

3

Aus Sicherheitsgründen, wenn Sie ein Ereignis mit Javascript auslösen, wird es anders registriert, als wenn der Benutzer das Ereignis ausgelöst hat. Console log das ev Objekt und Sie werden signifikante Unterschiede zwischen den beiden Fällen sehen.

mybutton.click(function(ev) { 
    console.log(ev); 
}); 

Hier sind einige Beispielausgabe der beiden Fälle:

jQuery.Event 
currentTarget: button 
data: null 
delegateTarget: button 
handleObj: Object 
isTrigger: true 
jQuery191011352501437067986: true 
namespace: "" 
namespace_re: null 
result: undefined 
target: button 
timeStamp: 1360472753601 
type: "mousedown" 
__proto__: Object 

jQuery.Event {originalEvent: MouseEvent, type: "mousedown", isDefaultPrevented:  function, timeStamp: 1360472840714, jQuery191011352501437067986: true…} 
altKey: false 
bubbles: true 
button: 0 
buttons: undefined 
cancelable: true 
clientX: 39 
clientY: 13 
ctrlKey: false 
currentTarget: button 
data: null 
delegateTarget: button 
eventPhase: 2 
fromElement: null 
handleObj: Object 
isDefaultPrevented: function returnFalse() { 
jQuery191011352501437067986: true 
metaKey: false 
offsetX: 37 
offsetY: 11 
originalEvent: MouseEvent 
pageX: 39 
pageY: 13 
relatedTarget: null 
screenX: 1354 
screenY: 286 
shiftKey: false 
target: button 
timeStamp: 1360472840714 
toElement: button 
type: "mousedown" 
view: Window 
which: 1 
__proto__: Object 
+0

Dies ist ein Drag-Beispiel, die Frage stellt eine Frage zum Klick-Event. –

+0

In Chrome auf dem Ereignis button.click: e zeigt (e.originalEvent.type == 'mousedown') für einen skriptgesteuerten Klick und einen echten Klick. Gibt es andere Eigenschaften, die in verschiedenen Browsern unterschiedlich und konsistent sind? – user151402

+0

Wie wäre es mit [ev.isTrigger] (http://stackoverflow.com/questions/10704168/in-javascript-what-is-event-istrigger) –

0

Fiddle hier.

$("button").mousedown(function(e) { 
    if(e.which) { 
     alert(1); 
    } 
}); 
$("button").trigger("mousedown"); 

oder Javascript:

document.getElementsByTagName('button')[0].onmousedown = function(e) { 
if(e.which) { 
    alert(1); // original click 
} 
} 
document.getElementsByTagName('button')[0].onmousedown(); 

Sie in der Geige sehen, wird es nicht Trigger-Funktion nur aufrufen lassen, aber wenn die Maus nach unten auf die Schaltfläche ist. Wenn ein automatisierter Klick auf die Schaltfläche ausgelöst wird, ist e.which undefined, was leicht abgefangen werden kann.

UPDATE:Fiddle For Javascript

+0

Gute Geige, ich habe gerade eine console.log hinzugefügt, damit er sehen kann diese Ausgabe wie ich in meiner Antwort beschrieben habe, wenn er wollte. [Updated Fiddle] (http://jsfiddle.net/332AA/1/) –

+0

@KyleWeller Sie können es auch zu meiner Antwort hinzufügen Sir. –

+0

Der 'e.which' Trick wird bereits in der Frage erwähnt; und es scheint nicht für OP zu funktionieren. –

10

, wenn eine Taste der Maus klicken, geschieht durch das Ereignis e in der Regel hat sich der Mauszeiger Position aufgezeichnet. Versuchen Sie etwas wie:

if(e.screenX && e.screenX != 0 && e.screenY && e.screenY != 0){ 
    alert("real button click"); 
    } 
+0

+1 Zur Vereinfachung :) –

+0

Funktioniert für Chrome, aber nicht in IE-Dev-Konsole. In IE hat e.screenX + Werte sowohl für manuelle als auch für skriptbasierte button.click – user151402

5

Nein, es ist nicht in allen Fällen möglich. Wie andere Antworten erwähnt, können Sie nach den Mauskoordinaten suchen (clientX/Y und screenX/Y), und wenn sie nicht vorhanden sind, können Sie annehmen, dass es war wahrscheinlich keine menschliche erzeugte Aktion.

Wenn der Benutzer jedoch auf die Schaltfläche klickt und die Leertaste verwendet, um darauf zu klicken oder auf andere Weise ohne Mausklick klickt, sind die Koordinaten ebenfalls null, und diese Methode bestimmt fälschlicherweise, dass es sich um einen skriptgesteuerten Klick handelt . Wenn das Skript dispatchEvent anstelle von click verwendet, können Koordinaten für das Ereignis angegeben werden. In diesem Fall wird diese Methode fälschlicherweise als benutzergenerierter Klick identifiziert.

// This will produce what appears to be a user-generated click. 
function simulateClick(element) { 
    var evt = document.createEvent("MouseEvents"); 
    evt.initMouseEvent("click", true, true, window, 
    0, 110, 111, 10, 11, false, false, false, false, 0, null); 
    element.dispatchEvent(evt); 
} 

http://jsfiddle.net/bYq7m/

Verwandte Themen