Click Smiley to TextArea

JavaScript
1 

<script type="text/javascript">
    function insertSmiley(smiley)
    {
    
        var currentText = document.getElementById("replybody");
        
        var smileyWithPadding = " " + smiley + " ";
        currentText.value += smileyWithPadding;
    currentText.focus();
    
    }
</script> 



<img src="/images/smilies/ange.gif" onclick="insertSmiley('(angel)')" />
<img src="/images/smilies/angry.gif" onclick="insertSmiley(':@')" />
<img src="/images/smilies/argh.gif" onclick="insertSmiley('(argh)')" />
<img src="/images/smilies/confused.gif" onclick="insertSmiley(':Z')" />
<img src="/images/smilies/cool.gif" onclick="insertSmiley('B)')" />
<img src="/images/smilies/cry.gif" onclick="insertSmiley(';(')" />
<img src="/images/smilies/fag.gif" onclick="insertSmiley('(smoke)')" />
<img src="/images/smilies/frown.gif" onclick="insertSmiley('-.-')" />
<img src="/images/smilies/grin.gif" onclick="insertSmiley(':D')" />
<img src="/images/smilies/happy.gif" onclick="insertSmiley(':)')" />
<img src="/images/smilies/love.gif" onclick="insertSmiley(':3')" />
<img src="/images/smilies/newbie.gif" onclick="insertSmiley('(newb)')" />
<img src="/images/smilies/oh.gif" onclick="insertSmiley(':o')" />
<img src="/images/smilies/oh2.gif" onclick="insertSmiley(':O')" />
<img src="/images/smilies/oh3.gif" onclick="insertSmiley(':|')" /><br />
<img src="/images/smilies/question.gif" onclick="insertSmiley('(question)')" />
<img src="/images/smilies/roll.gif" onclick="insertSmiley('o.o')" />
<img src="/images/smilies/sad.gif" onclick="insertSmiley('>:(')" />
<img src="/images/smilies/santa.gif" onclick="insertSmiley('(santa)')" />
<img src="/images/smilies/shame.gif" onclick="insertSmiley(':$')" />
<img src="/images/smilies/slant.gif" onclick="insertSmiley(':/')" />
<img src="/images/smilies/sleep.gif" onclick="insertSmiley('(zzz)')" />
<img src="/images/smilies/tdown.gif" onclick="insertSmiley('(thumbdown)')" />
<img src="/images/smilies/tongue.gif" onclick="insertSmiley(':P')" />
<img src="/images/smilies/tonguew.gif" onclick="insertSmiley(';P')" />
<img src="/images/smilies/tup.gif" onclick="insertSmiley('(thumbup)')" />
<img src="/images/smilies/unhappy.gif" onclick="insertSmiley(':(')" />
<img src="/images/smilies/wink.gif" onclick="insertSmiley(';)')" />
<img src="/images/smilies/lovely.gif" onclick="insertSmiley('(L)')" />
<br />
<textarea name="replybody" rows="10" cols="80"></textarea>

It works fine in IE, click the image, it inserts to my text area, but in Firefox it doesn’t.

Anybody know how I can get it to work in both?

2

It’s because your document doesn’t have an element with an id of “replybody”
There’s only an element with a name of “replybody”

Why it works in IE is that IE automatically creates global variables for elements with names and ids, and some other criteria as well, which does cause problems in its own right.

Solution #1: Use getElementsByName


var currentText = document.getElementsByName("replybody")[0];

Solution #2: Put an id attribute on the textarea


<textarea name="replybody" id="replybody" rows="10" cols="80"></textarea>

Personally I prefer the first solution myself, because it’s not adding extra unneeded cruft to the html code.

3

Ah, I can’t believe I missed that.

Thanks alot :slight_smile: