javascriptjqueryajaxemoticons

Handle 'img' click event and insert 'alt' attribute into textbox using jQuery

I'm creating a web chat page using PHP and jQuery, and I am adding an emoticon feature, which everything is done except for the jQuery portion. My problem is I'm not getting a click event when I click on the emoticon image. In the handler it is supposed to get the current message value, get the text version of the emoticon from the 'alt' attribute, and set the textbox value to its previous value + the emoticons text appended.

Here is what I tried:

(Each button appears as so: <img class="embtn" src="emoticons/happy.gif" alt=":)" />)

$(document).ready(function(){
    // Insert Emoticon
    $(".embtn").click(function(event){
        var prevMsg = $("#usermsg").val();
        var emotiText = event.target.attr("alt");
        $("#usermsg").val(prevMsg + emotiText);
    });
});

How should I go about doing this?

The version of jQuery I am using is 1.3.

Solution

  • Try changing:

    var emotiText = event.target.attr("alt");

    to:

    var emotiText = $(event.target).attr("alt");

    In the future check the console for errors when you are stumped.