=================================

How to get input text field using HTML and JavaScript | DzQ39 |

This is a quick example of how to get the input value from the input text filed, display it and reset it back to the original content.

Code




 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<!DOCTYPE html>
<html>
<body>

Enter something: <input type="text" id="myText" value="" placeholder="Enter anything">

<p>Enter anything in the above field and click on the Submit button to display the value of the value attribute of the text field.</p>
<p>To clear, click on the Reset button.</p>

<button onclick="getInputText()">Submit</button>
<button onclick="resetInputField()">Reset</button>

<p id="demo"></p>

<script>
function getInputText() {
var x = document.getElementById("myText").value;
document.getElementById("demo").innerHTML = x;
}

function resetInputField() {
document.getElementById("myText").value = "";
document.getElementById("myText").placeholder = "Enter anything";
document.getElementById("demo").innerHTML = "";
}

</script>
</body>
</html>

Result

Reference:

https://www.w3schools.com/jsref/prop_text_value.asp

https://www.w3schools.com/tags/att_input_placeholder.asp

Comments