Ergebnis 1 bis 10 von 10
-
03-05-2017, 11:22 #1
Grünschnabel
- registriert
- 24-02-2017
- Beiträge
- 6
Pause zwischen 2 Klicks erzwingen
Hallo Community,
folgendes Problem. Meine Webseite dient zur Steuerung einer SPS. Nun kommt es aber leider durch die benutzung des Touchscreens dazu das manchmal ein Button 2 mal gedrückt oder wenn man am Rand des Buttons klickt, zwei nebeneinander liegende Buttons gedrückt werden.
Die Buttons sind schon groß genug. Aber manch einer hat Bratzen statt Hände!
Gibt es eine Möglichkeit zu verhindern das ein Doppelklick gewertet wird oder das wenn ein Klick erfolgt ist die Webseite für z.B 300ms nicht mehr auf eingaben reagiert?
Vielen Dank!
-
03-05-2017, 13:31 #2
AW: Pause zwischen 2 Klicks erzwingen
ja es gibt dafür viele möglichkeiten. steht denn an der maschine js und css uneingeschränkt zur verfügung wie in einem browser?
Das deutsche Javascript Forum http://forum.jswelt.de
-
03-05-2017, 17:34 #3
AW: Pause zwischen 2 Klicks erzwingen
HTML-Code:<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Fenstertitel</title> <style type="text/css"></style> </head> <body> <button id="button">click</button> <script type="text/javascript"> function log(str){ console.log(new Date(), str); } document.getElementById("button").addEventListener("click", function(){ log("button clicked"); log("disabling button"); this.disabled = true; var button = this; window.setTimeout(function(){ log("enabling button"); button.disabled = false; }, 1000); }); </script> </body> </html>
-
08-05-2017, 17:13 #4
Grünschnabel
- registriert
- 24-02-2017
- Beiträge
- 6
AW: Pause zwischen 2 Klicks erzwingen
Super danke, so würde es klappen aber eben nur auf alle Elemente welche als id den "button" haben.
Ich möchte aber den klick innerhalb dieser Zeit komplett verbieten bzw. nicht werten. Dachte eher so an:
HTML-Code:<script type="text/javascript" language="JavaScript"> // Wartezeitzeit bis klicken wieder erlaubt (in millisek) var Wartezeit = 300; // bei mousedown klick für Wartezeit verbieten function dontklick() { Counter = 0 + Wartezeit; return } </script> <body onMousedown="dontklick()">
@mikedoe
Ja es ist ein Raspberry Pi 3 B mit Jessie drauf. Dort wird im Kioskmodus der Browser "Chromium" aufgerufen. Im Hintergrund läuft dann eine Anwendung welche auch die jQuery Lib und wenn benötigt auch noch die UI zur Verfügung stellt.
-
09-05-2017, 12:52 #5
AW: Pause zwischen 2 Klicks erzwingen
Basierend auf kkapsners Beispiel evtl. so erweitern:
HTML-Code:<!DOCTYPE html> <html lang="de"> <head> <title>Disable buttons</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <button class="myDisableButton" id="button_1">click 1</button> <button class="myDisableButton" id="button_2">click 2</button> <button class="myDisableButton" id="button_3">click 3</button> <button class="myDisableButton" id="button_4">click 4</button> <button class="myDisableButton" id="button_5">click 5</button> <script> function log(str) { console.log(new Date(), str); } function forEach (array, callback, scope) { for (var i = 0; i < array.length; i++) { callback.call(scope, i, array[i]); } } var myDisableButtons = document.querySelectorAll('.myDisableButton'); forEach(myDisableButtons, function (index, node) { console.log(index, node); node.addEventListener('click', function() { log("button " + node.id + " clicked"); log("disabling all buttons"); forEach(myDisableButtons, function (index, node) { node.disabled = true; }); window.setTimeout(function() { log("enabling all buttons"); forEach(myDisableButtons, function (index, node) { node.disabled = false; }); }, 1000); }); }); </script> </body> </html>
Hoffe ich konnte helfen
-
12-05-2017, 12:22 #6
Grünschnabel
- registriert
- 24-02-2017
- Beiträge
- 6
AW: Pause zwischen 2 Klicks erzwingen
Mhh irgendwie reden wir aneinander vorbei. Vieleicht habe ich mich blöd ausgedrückt. Es handelt sich nicht um richtige "Buttons" sondern um ein JS welches aus einer XML ein Menü erstellt. Und diese Funktionen im Menü sollen quasi gesperrt werden.
Schwer zu erklären. Hier der Source-Code:
Code:index(model) ::= << <!doctype html> <html> <style> </style> <head> <title>Bespiel</title> <link rel="stylesheet" href="base.css" /> <link rel="stylesheet" href="status.css" /> <script src="jquery.js"></script> <script> var localRevision = -1; var runningAjaxRequest; // call method function callDeviceMethod(deviceId, methodId) { jQuery.get('rest/devices/' + deviceId + '/methods/' + methodId); } // set attribute function setDeviceAttribute(deviceId, attributeId, attributeName, currentValue) { var newValue = prompt("Attributwert \"" + attributeName + "\" ändern:", currentValue); if (newValue != null) { jQuery.get('rest/devices/' + deviceId + '/attributes/' + attributeId + '/valueText?set=' + newValue); } } // update all gui elements function updateGui(attributeUpdates) { var lastDeviceId = -1; jQuery.each( attributeUpdates, function( index, updateItem ){ // device var deviceSelectorKey = '#device' + updateItem.D; // detect first attribute of a device var firstAttributeOfDevice = (lastDeviceId != updateItem.D); lastDeviceId = updateItem.D; if (firstAttributeOfDevice) { // color knob var deviceKnob = jQuery(deviceSelectorKey + ' a span'); var deviceColorType = deviceKnob.data('devicecolortype'); var knobColor = "white"; switch (deviceColorType) { case "RedGreen": switch (updateItem.V) { case 0: knobColor = "red"; break; case 1: knobColor = "green"; break; } break; case "RedYellowGreen": switch (updateItem.V) { case 0: knobColor = "red"; break; case 1: knobColor = "yellow"; break; case 2: knobColor = "green"; break; } break; } deviceKnob.attr("class", knobColor + "Knob"); // device value (value of first attribute, if this attribute is not represented by color) var deviceText = jQuery(deviceSelectorKey + ' a div'); deviceText.text(updateItem.T); } // attribute var attributeSelectorKey = deviceSelectorKey + 'attribute' + updateItem.A; // update attribute edit href var obj = jQuery(attributeSelectorKey + ' a'); var oldHref = obj.attr("href"); var newHref = oldHref.replace(/(setDeviceAttribute\('\w+', '\w+', '.*?', ').+?('\))/, '\$1' + updateItem.T + '\$2'); obj.attr("href", newHref); // update attribute value div jQuery(attributeSelectorKey + ' a div').text(updateItem.T); }); } // server push by long polling (Comet) function longPollAttributes(urlToPoll) { runningAjaxRequest = jQuery.ajax({ url: urlToPoll, type: "GET", dataType : "json", // Code to run if the request succeeds; // the response is passed to the function success: function( attributeUpdateMessage ) { localRevision = attributeUpdateMessage.revisionNumber; updateGui(attributeUpdateMessage.attributeUpdates); jQuery("#connectionLostBox").hide(); // current request completed, just start another call longPollAttributes("events/attributes?clientRev=" + localRevision); // long poll (wait for updates in relation to local revision) }, error: function(xhr, error, errorThrown){ if (error != "abort") { jQuery("#connectionLostBox").show(); longPollAttributes("rest/attributes"); // full reload (no long poll) after connection broken } } }); } // initial call (get all attributes for first display, after that do long polling) longPollAttributes("rest/attributes"); jQuery(window).bind("beforeunload", function() {runningAjaxRequest.abort();}); </script> </head> <body> <div class="header"> <ul> <li> <a href="/index.html" class="header-actyvE">Admin</a> </li> </ul> </div> <table border="0" cellpadding="40"> <tr align="left" valign="top"> $model.infrastructure.Groups:{group | <td> <h1 class="group">$group.Name$</h1> $index_devices(group.Devices)$ $group.Groups:{group | <h2 class="group">$group.Name$</h2> $index_devices(group.Devices)$ $group.Groups:{group | <h3 class="group">$group.Name$</h3> $index_devices(group.Devices)$ $group.Groups:{group | <h4 class="group">$group.Name$</h4> $index_devices(group.Devices)$ $group.Groups:{group | <h5 class="group">$group.Name$</h5> $index_devices(group.Devices)$ }$ }$ }$ }$ </td> }$ </tr> </table> <div class="graybox-ontop" id="connectionLostBox"> <div class="error-box"> <div class="msg">Fehler – Keine Verbindung!</div> </div> </div> </body> </html> >>
-
12-05-2017, 13:22 #7
AW: Pause zwischen 2 Klicks erzwingen
Bei den ganzen Variablen ist es doch etwas mühsam zu erraten wie der fertige HTML-Code ausschaut. Du verwendes also Links (
a href
) auf die "geklickt" bzw. "getoucht" wird?
Wenn ja, wie sehen diese dann aus?Hoffe ich konnte helfen
-
12-05-2017, 14:00 #8
Foren-Gott
- registriert
- 19-05-2008
- Beiträge
- 5.667
AW: Pause zwischen 2 Klicks erzwingen
registriere im click einen click-handler am document in der capturing phase
im handler verhinderst du die weiterleitung
nach deiner abgelaufenen zeit entfernst du diesen eventhandler wieder
-
12-05-2017, 16:17 #9
Grünschnabel
- registriert
- 24-02-2017
- Beiträge
- 6
AW: Pause zwischen 2 Klicks erzwingen
Das Script ist nicht von mir.
Es geht hierbei um die "LogoControl" von Frickelzeugs.de
LogoControl | Frickelzeugs
Es wird also die Middelware gestartet welche ein Webinterface hostet. Das besteht eben aus der index.st (Code eben gepostet) einer css und eben den js.
Da bin ich aber leider auch nicht tief genung drin. Ich dachte nur eben man könnte über einen einfachen Script welcher durch "mousedown" ausgelöst wird eben jeden weiteren Mousedown für eine einstellbare Zeit egal worauf auf der Webseite nicht werten.
Eben mit "<body onMousedown="dontklick()">" den Script "dontklick" ausführen. Und der soll eben dafür sorgen das "onMousedown" nicht gewertet wird oder in etwas umgewandelt wird.
-
19-05-2017, 17:43 #10
Ähnliche Themen
-
Pause erzwingen mit setInterval oder setTimeout
Von hilfebedürftig im Forum JavaScriptAntworten: 111Letzter Beitrag: 10-11-2012, 02:43 -
Button, onclick, pause zwischen mehreren Befehlen
Von Bububaba im Forum JavaScriptAntworten: 0Letzter Beitrag: 17-06-2008, 16:06 -
Hits ( Klicks ) zählen ... ?!
Von Strichmaxal im Forum JavaScriptAntworten: 23Letzter Beitrag: 29-03-2003, 15:21 -
Pause bei Scrollfunktion zur Bearbeitung von Klicks etc.
Von DarealZnarkde im Forum JavaScriptAntworten: 3Letzter Beitrag: 04-11-2002, 17:02 -
Klickzähler-Klicks anzeigen
Von asnoopa im Forum Serverseitige ProgrammierungAntworten: 0Letzter Beitrag: 19-04-2001, 01:00
Lesezeichen