For a project I'm currently working on am trying to reach the following:
I have a simple page, on this page are 4, hidden and not visible elements, they are simply formatted as this:
<a href="#" class="link_1"></a>
<a href="#" class="link_2"></a>
<a href="#" class="link_3"></a>
<a href="#" class="link_4"></a>
Basically all i want, is too build a sort of Easter egg, so when a user clicks these buttons in a specific order, i.e. link_4 -> link_1 -> link_3 -> link_2 it triggers a certain event, whatever this might be.
Ofcourse the event could only be triggered if the right combination/order of clicks have been done.
Any ideas how to go about this using jQuery?
If you want to run an automated click event more than once, you can write the for loop and call target. click() inside the for loop. It automatically invokes the click of the button until the counter reaches its maximum value and outputs the Triggered event 5 times.
That is: for a click on <td> the event first goes through the ancestors chain down to the element (capturing phase), then it reaches the target and triggers there (target phase), and then it goes up (bubbling phase), calling handlers on its way.
JavaScript events don't take any priorities. When and event is fired it is added to an event queue and executed as soon as possible. You can claim that it is a general rule that onclick attribut events will always trigger first, and that will always be true, but it's not because they are prioritized.
To add the click event in React using plain JavaScript, you need to use addEventListener() to assign the click event to an element. Create one <button> element as ref props so that it can be accessed to trigger the click event.
var click_order = [];
$('a').click(function (e) {
click_order.push($(this).index());
if (click_order.slice(-4) == '3,0,2,1') {
// easter egg stuff
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With