Sunamena Posted May 7, 2017 Share Posted May 7, 2017 This is currently my Function: function insertText(elemID, text) { var elem = document.getElementById(elemID); elem.innerHTML += text; } And this is my onclick: onclick="insertText('bericht', 'mytext');" What it needs to do is add mytext at the END of the current text in my Textarea. This function works, but as soon as i enter something IN the textarea, the function stops working. Does anyone here know how to solve this issue? Link to comment Share on other sites More sharing options...
dsonesuk Posted May 7, 2017 Share Posted May 7, 2017 So everytime you click whatever, it will add 'mytext' to end of content in textarea, trouble is a teaxtarea being a form input uses value, NOT innerHTML. Link to comment Share on other sites More sharing options...
dsonesuk Posted May 8, 2017 Share Posted May 8, 2017 (edited) If you want a event to be triggered everytime something is typed within the textarea then use 'onkeyup' event instead of 'onclick. function insertText(elemID, text) { var elem = document.getElementById(elemID); elem.value += text; } <textarea name="textarea1" id="bericht" onkeyup="insertText('bericht', 'mytext');"></textarea> IF you want to identify a specific key press for example 'enter' key, you have to pass event and check keycode was 13 <textarea name="textarea1" id="bericht" onkeyup="insertText('bericht', 'mytext', event);"></textarea> function insertText(elemID, text, e) { var code = (e.keyCode ? e.keyCode : e.which); var elem = document.getElementById(elemID); if (code === 13) { elem.value += text; } } Edited May 8, 2017 by dsonesuk Link to comment Share on other sites More sharing options...
Sunamena Posted May 8, 2017 Author Share Posted May 8, 2017 As soon as i start typing in the textarea and press the image with the onclick command, it stops functioning. Both innerHTML and value put the content IN the textarea, but NOT anymore once any action has been preformed inside the textarea (such as deleted or typed something) Link to comment Share on other sites More sharing options...
dsonesuk Posted May 8, 2017 Share Posted May 8, 2017 There is a browser compatibility issue with using innerHTML for a form input, that is why you should use value instead. This works fine for me, in all browsers <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" id="viewport" content="target-densitydpi=high-dpi,initial-scale=1.0,user-scalable=no" /> <title>Document Title</title> <script type="text/javascript"> function insertText(elemID, text) { var elem = document.getElementById(elemID); elem.value += (' ' + text); } </script> <style type="text/css"> </style> </head> <body> <div><textarea name="textarea1" id="bericht"></textarea></div> <img src="https://www.w3schools.com/tags/smiley.gif" alt="Smiley face" width="42" height="42" onclick="insertText('bericht', 'mytext');"> </body> </html> Link to comment Share on other sites More sharing options...
Sunamena Posted May 8, 2017 Author Share Posted May 8, 2017 Strange something: It does indeed work like this: <head> ,,, <script type="text/javascript"> function insertText(elemID, text) { var elem = document.getElementById(elemID); elem.value += (' ' + text); } </script> ... </head> But i encounter the issues when i do this: <head> ... <script src="js/mylibrary.js"></script> ... </head Link to comment Share on other sites More sharing options...
dsonesuk Posted May 8, 2017 Share Posted May 8, 2017 It won't work if the relative path to js file is wrong, if there is error in code preceeding this code or you have included <script></script> tags. Link to comment Share on other sites More sharing options...
sandeepm Posted May 18, 2017 Share Posted May 18, 2017 function insertText(elemID, text) { var elem = document.getElementById(elemID); elem.value += text; } innerHTML is used to display text in html divs. By using name also we can get the values. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now