Text is not entered. after clicking textarea

Question

Text is not entered. after clicking textarea

Navigation

#1 by (2 votes)

1

What happens is as follows:

I'm trying to insert an emoticon in this textarea

<textarea name="mensagem" cols="90" rows="10" placeholder="digite o texto ou cole HTML">[8)]</textarea>

The emoticons are in a bar that inserts when the extension loads. so one side of the other [] [] [] []. So far so good;

THE PROBLEM: When I click on an emoticon, it is inserted into the textarea without major problems, but if I click on the textarea to type a text, either next to the emoticon, below or anywhere, and then click to insert another emoticon, it simply does not insert no more.

Example:

I clicked and entered the emoticon > 'Text that I am typing' > Now, when I click again to add another emoticon, it does not enter the textarea. Simply, there is only the first emoticon, and the text that I typed.

JAVASCRIPT CODE:

window.onload = function teste() {
    var salvo = document.querySelector('textarea').onfocus;
    add = document.getElementsByTagName("td")[2].innerHTML = '<a href=javascript:void(0); onclick=a=document.querySelector("textarea").innerHTML="[:(]"><img src="http://app.e-orkut.com/assets/images/emoticons/2.gif">'+'<ahref=javascript:void(0);onclick=a=document.querySelector("textarea").innerHTML="[8)]"><img src="http://app.e-orkut.com/assets/images/emoticons/1.gif"></a>'+'<imgsrc="http://app.e-orkut.com/assets/images/emoticons/3.gif">' 
    + '<img src="http://app.e-orkut.com/assets/images/emoticons/4.gif">'+'<imgsrc="http://app.e-orkut.com/assets/images/emoticons/5.gif">' 
    + '<img src="http://app.e-orkut.com/assets/images/emoticons/6.gif">'+'<imgsrc="http://app.e-orkut.com/assets/images/emoticons/7.gif">' 
    + '<img src="http://app.e-orkut.com/assets/images/emoticons/8.gif">'+'<imgsrc="http://app.e-orkut.com/assets/images/emoticons/9.gif">';
}

javascript html

asked by anonymous 16.05.2016 / 03:02

1 answer

Disable native browser validation How to develop in Android Studio with the Firebird database?

score 2 · Answer 1

Your problem is that you are using .innerHTML when you should be using .value to change the contents of this <textarea> .

That said, as I think you should do this is like this:

function addMe(emoticon, target) {
    return function() {
        target.value += emoticon;
    }
}

window.onload = function() {
    var url = ['http://app.e-orkut.com/assets/images/emoticons/', '.gif'];
    var emoticons = ['[:(]', '[8)]', '[>:(]', '[:)]', '[;)]', '[:D]', '[:o]', '[:p]', '[:)]'];
    var textarea = document.querySelector('textarea');
    var emoticonsElement = document.getElementsByTagName("div")[0];
    for (var i = 0; i < emoticons.length; i++) {
        var img = document.createElement('img');
        img.src = url.join(i + 1);
        emoticonsElement.appendChild(img);
        img.addEventListener('click', addMe(emoticons[i], textarea));
    }
}

Example: link

In this way you always know which element has the emoticon, the code is more organized and you do not have HTML spread in the middle of JavaScript ...