Add event listener

Forum|Forum|9 years ago
November 25, 2016
3 replies
3914 views

Hi,

I confess I have no idea of how to use event listeners. I've looked elsewhere on the intenet, but I think the syntax may be Captivate-specific. I have 20 button that all use the same Javascript code that triggers according to the buton ID clicked.

I'd like not to add this same JS code to all the buttons, because that takes a long time to add every time I modify the code a little.

Is this a good job for an event listener?

If so, could someone help me with an example that i can paste into the slide enter javascript box?

So the example goal would be something like this, to hide whichever button is clicked:

var butName = this.document.activeElement.getAttribute("id");

cp.hide('butName');

Thank you.

This topic has been closed for replies.

Andy_K_nz

Inspiring

If you are only developing for HTML5 then I would also recommend CpExtra's event listener features. I've used it in a project that has 70+ buttons each with different external audio files that need to play when clicked. Depending on the button clicked I use JS to play the associated audio. CpExtra provides methods for you to easily apply your Advanced Actions/JS to multiple buttons based on a prefix or suffix used in the naming of the buttons. That in conjunction with event listening made this process extremely simple. Of course this a widget so it may not be suitable but I use CpExtra with 'headless loading' which basically means that it not applied like stand Captivate widget. When I publish the project the associated CpExtra JS files are included in the publish files.

tolgab12395142

Participant

You can check out http://infosemantics.com.au/ and their product CpExtra.

Lilybiri

Legend

Great widget, I love it! But the OP wants a JS solution, not a cp-solution.

Lilybiri

Legend

Why not combine a command 'Hide button' with your Javascript code in an advanced action? Since it is about a click, you can trigger it by the Success event of that button. If you turn this into a shared action, you can apply it to all buttons, and only have to change one parameter: the button.

B

bills89323792Author

Inspiring

The "hide" command is just an example, and my real code is a bit too complex, I guess, to be accepted in Advanced Actions, But it works in the regular Execute Javascript box.

Lilybiri

Legend

You can combine the script box within an advanced action. Or you could define JS functions in the JS file, and call the function inthe script box within an advanced action. You know I'm a big fan of advanced actions, but I use the script box within advanced actions often.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded