缩短几个元素的onclick代码 - JavaScript

Question

嗨，我有 60 个图像标签..

单击每个标签会在文本框中显示不同的文本.. 所以我想知道不是在每个图像标签中键入javascript代码，而是有什么方法可以使用单个javascript函数来做到这一点......并将该函数放在每个图像标签的onclick=""事件中。希望我说清楚...任何帮助将不胜感激...提前谢谢..:)哦，下面是所有 60 个图像标签...

    <img src='smileys/birthday.gif' style="height:22px;margin:3px;" />
<img src='smileys/blue.gif' style="height:22px;margin:3px;" />
      <img src='smileys/blush.gif' style="height:22px;margin:3px;" />
      <img src='smileys/boo.gif' style="height:22px;margin:3px;" />
      <img src='smileys/book.gif' style="height:22px;margin:3px;" />
      <img src='smileys/busted.gif' style="height:22px;margin:3px;" />
      <img src='smileys/goodnight.gif' style="height:22px;margin:3px;" />
      <img src='smileys/newhere.gif' style="height:22px;margin:3px;" />
      <img src='smileys/nicethread.gif' style="height:22px;margin:3px;" />
      <img src='smileys/nospamhere.gif' style="height:22px;margin:3px;" />
      <img src='smileys/offtopic.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-ashamed004.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-confused001.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-confused013.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-dance012.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-dance019.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-excited001.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-fart004.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-fart005.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-finger005.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-gen013.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-gen041.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-gen055.gif' style="height:22px;margin:3px;" />
     <img src='smileys/smiley-gen073.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-happy011.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-happy020.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-happy120.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-hug001.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-hug004.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-hug005.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-hug006.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-hug014.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-hug015.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-laughing001.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-laughing002.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love001.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love007.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love010.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love018.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love019.gif' style="height:22px;margin:3px;" />
     <img src='smileys/smiley-love022.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love025.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love027.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-love028.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-taunt002.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-taunt014.gif' style="height:22px;margin:3px;" />
      <img src='smileys/welcome.gif' style="height:22px;margin:3px;" />
     <img src='smileys/smiley-sad008.gif' style="height:22px;margin:3px;" />
      <img src='smileys/wtf.gif' style="height:22px;margin:3px;" />  
     <img src='smileys/smiley-confused002.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-angelic002.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-cool02.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-devil03.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-happy112.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-happy119.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-sad056.gif' style="height:22px;margin:3px;" />
      <img src='smileys/smiley-sad007.gif' style="height:22px;margin:3px;" /> 
      <img src='smileys/smiley-confused005.gif' style="height:22px;margin:3px;" />
      <img src='smileys/cheekkiss.gif' style="height:22px;margin:3px;" />
     <img src='smileys/toj.png' style="height:22px;margin:3px;" />

Answer 1

将您在该文本框中显示的文本添加为数据属性：

<img src='smileys/birthday.gif' data-text="Happy birthday" style="..." />

并做

$('img').on('click', function() {
    $('#textbox').text( $(this).data('text') );  // or val() if it's an input
});

如果您有其他不应应用的图像，请改用类作为选择器。