Hi,
probably an easy solution, but I can’t find it. I have this quiz where you need to push a button. When testing with children on the iPad I notice that sometimes they manage to click twice within a very short period of time. This means that the answer is counted twice as well. How do I prevent a double click? Preferably in Scene load. I tried: this.disabled = true.
Thank you.
Hi Djon!
From my readings, which usually have a warning not to assign a click & dblclick event to the same element, the standard solution is to use a timeout with the click event (a fair amount of code actually).
However, I think a simpler way would be to place an inert ‘cover’ element (initial settings in the Element Inspector: “Fill Style: None”; “Visibility: Hidden”) over the quiz button as soon as it is clicked - script:
hypeDocument.getElementById('cover').style.display='block';
One line of code; plus you have the ability to do other things if desired (but not required), including setting a timeout…
One_Click_Btn.hype.zip (14.1 KB)
Hi Jim,
thanks for your fast reply. It does not work for me. Maybe I do something wrong. I’ve only added the script to the first two questions. See attached file.
toets1.zip (1.6 MB)
Hi Djon!
It is 3:40 am here in California and it is my bedtime - but I noticed a few things in a quick skim of your example.
I will write back - probably in 10-11 hours.
Key observation: You placed the “cover” element at the bottom of all the layers (Scene 1) - so even if it is displayed everything else is on top of it. The “cover” element should be the top layer - or at least over the layer(s) it should be blocking from another click.
I tried putting the cover on top, but then the answer is not even clickable for the first time.
OK, I actually haven’t gone to bed yet, but now I really am (4:35 am) - first light in an hour.
The “cover” is supposed to be hidden at the start of a Scene (via the “Element Inspector”). When a button is clicked (“On Mouse Click”) it runs the javascript that shows the “cover” over the button.
Please have a (careful) look at my example again.
Every button in the quiz needs its own “cover” if You wish to disable each button for the entirety of the Scene.
There is another way to do this “prevent double click” that would not require a “cover” or a time out - You would just disassociate what ever script is associated with the button after the first click, but that approach is more involved. However, if your quiz has a ton of buttons it could be a better technique.
How many buttons are You needing to prevent a double click action in a scene? I believe I saw ten in your example is that typical?
Actually I need 3 per answer (one right and two wrong answers) I also have a quiz with 20 questions. Maybe I need to do something else, but first I will wait for your next move 
Hi Djon!
So we dump the “cover” element idea - way too clunky for your situation.
This concept OneClickOnly_JHSv1.hype.zip (13.9 KB) is based on (2) assumptions:
1) The simplest solution possible for this particular need.
The code manipulates the element that is clicked on - which of course is a button with the corresponding “On Mouse Click” event trigger. So no need for a set-up… i.e. creating IDs or classes for the buttons - a time waster given the number of buttons you have.
Also, no matter how many buttons (or few) it works. Flexible layouts, etc. do not matter. It is a self-adjusting schema (my favorite kind!).
2) The button(s) will be permanently disabled for the duration of the scene.
…Additionally, I wanted to give the kids a visual feedback loop.
function oneClick(hypeDocument; element; event) {
if (element.style.opacity == 1) {
// put your code here for the button
element.style.opacity = .5;
}
}
Demo here.
What this code does is:
The first time the button is clicked ( button opacity of 100%, or “1” in the code above) it executes the code you wish (right answer, wrong answer). Then the button is set to 50% opacity (or “.5” in the code above), which is typical behavior for a disabled element such as a button. You can make the opacity whatever You want, so long as it is not 100%.
Clicking on the button again results in the code not executing because the opacity of the element is no longer 100% (“1”). This opacity change will give feedback to the kids. They may not get it immediately, but after a few times they should realize the button is disabled~stops working when it fades.
Once again the enigma that is JavaScript displays its complete lack of imagination. In HyperTalk all you had to do was set an element to “disabled” (no “if’s” or “if else’s” required). You could easily send messages (code) to any target, and on and on. What a failure to serve JavaScript’s intended core audience (as exemplified by the questions on this Forum) - or may be not; perhaps JavaScript is deliberately designed to be a separator (designer clowns not need apply) - if so it is hitting its quota of mystery & confusion - as usual. Javascript is not a clear natural and elegant language - it is a cluttered~grafted mongrel expression. Apparently no one notices the ingenue has no clothes.
No reason to get excited, the Thief he kindly spoke, “There are many here among us who feel that Life is but a Joke.”
function oneClick(hypeDocument, element, event) { ...
It works but be careful! bad habit to get into 
Thank you very much @JimScott for your help and explanation.
@DBear could you explain ‘bad habit’ please?
Or
you could run this on the element click.
alert("Put your code here");// Code to run
element.style.opacity = .5; // grey out
element.style.pointerEvents = "none"; // stop registering clicks, to reset, set to 'auto'…or is that a semicolon instead of a comma?
whoops … yes comma I was on the move 
Hi Mark,
I used your code. Works nice! Small problem. When reloading the scene, it is not possible anymore to click the button. Understandable for me. But where to put the reset to “auto” function? I tried on unload scene. But doesn’t work.
regards,
Djon
How are you doing this ?
If you are jumping back to the scene using a elements action, like a on mouse click for a button then just use a new function for that.
var fooButton = hypeDocument.getElementById('fooButton');
fooButton.style.opacity = 1;
fooButton.style.pointerEvents = "auto";
I return from scene ‘result t1’ with the button that says ‘hier’ Please push the button first.
toets1.zip (2.0 MB)
ok,
Bit hard since I don’t read Dutch 
I have modified the code and some of the elements.
1,
I gave all the buttons a the same class name. oplossing
I do this because we want to reset all buttons that have been set to ‘none’ in an easy way.
So at the end when ‘hier’ is clicked, the rest function will go through all the buttons and reset them.
var oplossings = document.querySelectorAll('.oplossing');
for (i = 0; i < oplossings.length; i++) {
oplossings[i].style.opacity = 1;
oplossings[i].style.pointerEvents = "auto";
}
2,
You also had the problem that more than one answer could be clicked. Which would mess up the scoring.
So it would be good to disable ( set to ‘none’) the sibling buttons.
This is done by giving each set of buttons a second class that relates only to them.
When the oneClickRight or oneClickWrong functions are run we will look for the second class name of the button clicked and then search and set any buttons with the same class to ‘none’
element.style.color = "green"; // change txtcolor`
var oplossings = document.querySelectorAll('.oplossing');
var oplossingsClassList = element.classList[2] ;
for (i = 0; i < oplossings.length; i++) {
if ( oplossingsClassList == oplossings[i].classList[2]) {
oplossings[i].style.pointerEvents = "none";
}
}
toets_vMH3.hype.zip (2.1 MB)
Well, you know it’s Dutch. That also counts. 
Solution=oplossing : thank you google 
Thank you very much for the help. It works now. Tomorrow I will see if I completely understand what you’ve done.
Have a nice day.