我如何以一种可以将返回值传递给另一个函数的方式从我的 HTML 表单返回用户输入？

Question

Apologies if this is already covered... I'm trying to pass information from a basic text input form and then parse that information using another couple functions. I'm not able to figure out how to return the information from the function in the onClick property to pass it into another function.

 function getBulletAction(element) { return element[0].value; } // why can't i store this in a variable outside of the function??? let valueFrmForm = getBulletAction(document.getElementById("frmForm")); document.getElementById("log").innerHTML = valueFrmForm; //I want to pass the value returned from getBulletAction() to getAction() which will change the user input to lowercase characters. function getAction(OutOfTheFunction){ let action = userInput.toLocaleLowerCase('en-US'); return action; }

 <form name="bulletForm" id="frmForm"> Write the action of your bullet:<br> <input type="text" name="bulletAction" value="" style="width: 30%;"/> <input type="button" name="submitType" value="Submit" onClick="getBulletAction(this.parentElement)" /> </form> <h3>This is where the data is supposed to appear from getBulletAction()</h3> <p id="log"></p>

Answer 1

 function getBulletAction(element) { const val = element[0].value; console.log(val); return val; } 

 <form name="bulletActionForm"> Write the action of your bullet:<br> <input type="text" name="bulletAction" value="" style="width: 30%;" /> <input type="button" name="submitType" value="Submit" onClick="getBulletAction(this.parentElement)" /> </form> 

This will return the value of what is in name=bulletAction as a string :)

Answer 2

You are storing value in global variable when script loads(at the time when was empty)

1. Create one global variable at the start of script
2. Change value of global variable when user clicks submit button
3. Use the global variable in another function

 var text = ""; function getBulletAction(form) { text = form[0].value; //first input element return form[0].value; } function myFunc(form){ var inputText = getBulletAction(form); document.getElementById("log").innerHTML = getAction(); } function getAction(){ //let's use global variable let action = text.toLocaleLowerCase('en-US'); return action; } function alertMyGlobalVar(){ alert(text); }

 <form name="bulletForm" id="frmForm"> Write the action of your bullet:<br> <input type="text" name="bulletAction" value="" style="width: 30%;"/> <input type="button" name="submitType" value="Submit" onClick="myFunc(this.parentElement)" /> </form> <button onclick="alertMyGlobalVar()">Current value of global variable</button><br> <h id="log">This is where the data is supposed to appear from getBulletAction()</h3>