how can I create a button that when clicked, it simulates ENTER as if it were physically pressed on the keyboard.
In other words, this button when clicked simulates the ENTER button inside the text area, where text is being written.
For instance, after the button is clicked,
Original text area text:
XXX XXX XXX
Becomes
New text area text:
XXX XXX XXX
New line
All of this is simulated via a button click.
Let's assume the text area has an ID of #QR
Strictly javascript, no jquery
It's pretty easy though. All you have to do is add an event listener on the button like so:
HTML Code:
<textarea id="text_area"></textarea>
<button type="button" id="new_line">Click Me!</button>
JS Code
var textarea = document.getElementById("text_area"),
myBtn = document.getElementById("new_line");
myBtn.addEventListener("click", function(){
textarea.value += "\r\n";
textarea.focus(); // This is optional, if you want the user to go back into the textarea. This will be good then :)
}, false);
Note that i have declared the variables outside of the function such that on each button click, you don't have to jump into the DOM to look for the textarea over & over again.
Hope that helps :-)
html
<textarea id="txtArea"></textarea>
<button type="button" onclick="clickOn()">
js
<script>
function clickOn()
{
document.getElementById("txtArea").value = document.getElementById("txtArea").value + "\n*";
}
</script>
<button type="button" onclick="document.getElementById("QR").value+='\n';">Enter</button>