Highlighted

How do you create a password input field in an HTML5 project?

Explorer ,
Jul 10, 2020

Copy link to clipboard

Copied

Creating a text input field using Components is pretty easy. Unfortunately, its properties don't allow you to change things like the type attribute, so you can't set it to type=password.

 

You can add a class name to the text input component, and run javascript like:

 

 

$(".my-password-field").first().attr("type", "password");

 

 

or the equivalent raw javascript code (this is jquery), but you need to do it after the input field has been loaded.  I can run the above code, and it'll work in my browser's dev console, but at that point, the page has already loaded. How do I do it within the Adobe Animate project automatically?

 

Adding Javascript to the same frame that contains the text field doesn't appear to work, because at that point, the text input field hasn't been loaded yet.

 

I also tried the standard $(document).ready(), but that didn't work either.

Views

17

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

How do you create a password input field in an HTML5 project?

Explorer ,
Jul 10, 2020

Copy link to clipboard

Copied

Creating a text input field using Components is pretty easy. Unfortunately, its properties don't allow you to change things like the type attribute, so you can't set it to type=password.

 

You can add a class name to the text input component, and run javascript like:

 

 

$(".my-password-field").first().attr("type", "password");

 

 

or the equivalent raw javascript code (this is jquery), but you need to do it after the input field has been loaded.  I can run the above code, and it'll work in my browser's dev console, but at that point, the page has already loaded. How do I do it within the Adobe Animate project automatically?

 

Adding Javascript to the same frame that contains the text field doesn't appear to work, because at that point, the text input field hasn't been loaded yet.

 

I also tried the standard $(document).ready(), but that didn't work either.

Views

18

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jul 10, 2020 0
_tal_ LATEST
Explorer ,
Jul 10, 2020

Copy link to clipboard

Copied

This:

var checkExist = setInterval(function() {
   if ($(".my-password-field").length) {
      $(".my-password-field").first().attr("type", "password");
      clearInterval(checkExist);
   }
}, 100); // check every 100ms

Source: https://stackoverflow.com/a/16149679/6423456

 

Seems to work, but is a bit hacky. Is this really the best way to do it?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 10, 2020 0