Search code examples
javascripthtmlwebuser-input

Javascript : Inputfield Focus Event / trigger


I'm an Absoulute noob in js, as this is actually my first time even looking at it. My Issue isn't in js itself it's in understanding the connection between js and HTML. I'm Using a speicifc Software that is called " Ventuz " this software is node based, i'm using it to open a speicfic webpage. this webpage has inputfields ( user registration form). I'm trying to just get a trigger or something that tell's me that user pressed the Input Field so i can trigger something. A boolean can solve my issue. using ventuz, i can write JS code that can do that for me. This is what i currently have.

function myFunction() {
isFocused = true;
}

isFocused is a bool that i added in ventuz as an Output. I just want to play with this bool so i can trigger my stuff. My issue now is that I Don't understand how to make the above html code work with the webpage that the user is veiwing. how do i connect the actual inputfields on the page to my function?

This is the webpage :- Click Here

According to my understanding i need to call my js function in the html like this :-

<input type="text" onfocus="myFunction(this)">

But i don't know how to call my js function in the html of the webpage. Remember that i'm using a software and using that software i'm using a web node that opens for me this page. And the software fully supports js and tweaking a webpage as you want.

I'm sorry for such a silly question. but i really can't figure it out :(

Thank you.


Solution

  • So let's say you added a div to test output.

    <div id="message"></div>
    <input type="text" onfocus="myFunction()">
    

    And called it like this.

    function myFunction() {
    var isFocused = "It worked!";
    document.getElementById("message").innerHTML = isFocused;
    }
    

    This would output the results of your function.

    This is a great resource to start out. https://www.w3schools.com/js/default.asp