---
title: "Klickbara smileys, HUR?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/164606-klickbara-smileys-hur"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "aasah"
published: "2007-09-17T21:54:57.000Z"
updated: "2007-09-18T08:56:38.000Z"
replies: 6
views: 584
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/164606-klickbara-smileys-hur"
---

# Klickbara smileys, HUR?

## #1 — aasah, 2007-09-17T21:54Z

Jag håller på att skriva om min gästbok och skulle gärna vilja ha klickbara smileys till den. Trodde inte det skulle vara så svårt, men någonting är uppenbart fel. Min för ändamålet framtagna testfil ser ut så här:

```php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <meta name="robots" content="noindex">
<!-- ... -->
</head>
<body>
<!-- ... --> 
<div id="content">  <script type="text/javascript">

function addCode(code) {
   var ta = document.getElementByName('newest'); //Rad 33
   ta.innerHTML = ta.innerHTML + ' ' + code;
}
</script>

<p>Clickable? <table>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/smile.gif" alt=":)" onclick="addCode(':)');"></td><td>:)</td>
    <td>&nbsp;&nbsp;</td><td>&nbsp;&nbsp;</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/biggrin.gif" alt=":D" onclick="addCode(':D');"></td><td>:D</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/supergrin.gif" alt=":e" onclick="addCode(':e');"></td><td>:e</td>
    <td>&nbsp;&nbsp;</td><td>&nbsp;&nbsp;</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/wink.gif" alt=";)" onclick="addCode(';)');"></td><td>;)</td>
    </tr>
<!-- ... -->
<p><form method="POST" name="newPost" action="tst.php" ><br>
<table class="karm">
<tr><td>Subject(Optional): </td><td><input type="text" name="subject" value=""></td></tr>
<tr><td colspan=2>Write your comment (below)</td></tr>
<tr><td colspan=2><textarea name="newest" rows=15 cols=60></textarea></td></tr>
</table>
<input type="submit" name="submitPost" value="Post it!" ><br><br>
</form>
```

Sidan laddar snällt, men om man klickar på en smiley så... Resultat i IE JS-fel, resultat i FF inget fel, men inga klickbara smileys heller...   :( 

> **IE's JS-fel skrev:**
>
> Rad: 33
> Tecken: 4
> Objektet stöder inte egenskapen eller metoden
> Kod: 0

Vad är det som inte stöds? Och hur borde det stå?

Permalänk: https://www.webforum.nu/p/164606

## #2 — zcorpan, 2007-09-17T22:08Z

getElement**s**ByName...

Eller getElementBy**Id**.

Permalänk: https://www.webforum.nu/p/2029231

## #3 — aasah, 2007-09-17T22:46Z

> **zcorpan skrev:**
>
> getElement**s**ByName...
> 
> Eller getElementBy**Id**.

Åh! Tackar!   :birp Det plockade bort felmeddelandet i IE, så nu är FF och IE lika: 

Inget fel och inget händer! Fortfarande adderas inte smiley koden till textarean... Någon som ser varför?

Eller... är det så att ta blir en array om det heter get Element**s**...? Borde jag använda ta\[0\].innerHTML eller något?   :q   :l

Permalänk: https://www.webforum.nu/p/2029234

## #4 — colione, 2007-09-18T06:19Z

Ja, alternativt sätta ett id på den så kan du accessa den via getElementById.

Permalänk: https://www.webforum.nu/p/2029251

## #5 — aasah, 2007-09-18T07:53Z

Tack, colione! Bestämde mig för ett id. Och då fungerar allt som smort i IE.   :e 

Tyvärr kan jag inte säga detsamma om FF.   :( När sidan laddat kan jag trycka på smileysarna och de dyker upp i textarean. Men så fort jag börjat skriva i textarean upphör klickbarheten?!?   :q   :q   :q Vad är fel och varför?

Aktuell kod:

```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <meta name="robots" content="noindex">
<!--- ... --->
</head>
<body>
<!-- meny --->
<div id="content">  <script type="text/javascript">

function addCode(code) {
   var ta = document.getElementById('newest');
   ta.innerHTML = ta.innerHTML + ' ' + code;
}
</script>

<p>Clickable? <table>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/smile.gif" alt=":)" onclick="addCode(':)');"></td><td>:)</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/biggrin.gif" alt=":D" onclick="addCode(':D');"></td><td>:D</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/supergrin.gif" alt=":e" onclick="addCode(':e');"></td><td>:e</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/wink.gif" alt=";)" onclick="addCode(';)');"></td><td>;)</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/tongue.gif" alt=":p" onclick="addCode(':p');"></td><td>:p</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/devel.gif" alt="§sly" onclick="addCode('§sly');"></td><td>§sly</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/alarmed.gif" alt=":o" onclick="addCode(':o');"></td><td>:o</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/rolleyes.gif" alt=":roll" onclick="addCode(':roll');"></td><td>:roll</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/devilgrin.gif" alt="§evil" onclick="addCode('§evil');"></td><td>§evil</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/grumpy.gif" alt=":(" onclick="addCode(':(');"></td><td>:(</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/angry.gif" alt=":mad" onclick="addCode(':mad');"></td><td>:mad</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/dead.gif" alt=":x" onclick="addCode(':x');"></td><td>:x</td>
    </tr>
</table><p><form method="POST" name="newPost" action="textAreaTst.php" ><br>
<table class="karm">
<tr><td>Subject(Optional): </td><td><input type="text" name="subject" value=""></td></tr>
<tr><td colspan=2>Write your comment (below)</td></tr>
<tr><td colspan=2><textarea id="newest" name="newest" rows=15 cols=60></textarea></td></tr>
</table>
<input class="buttonColorG" type="submit" name="submitPost" value="Post it!" ><br><br>
</form>
```

Permalänk: https://www.webforum.nu/p/2029266

## #6 — colione, 2007-09-18T08:39Z

Behöver du verkligen använda innerHTML? Vad sägs om value?

```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <meta name="robots" content="noindex">
<!-- ... --->
</head>
<body>
<!-- meny -->
  <script type="text/javascript">

function addCode(code) {
   var ta = document.getElementById('newest');
   ta.value +=' ' + code;
}
</script>

<p>Clickable? <table>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/smile.gif" alt=":)" onclick="addCode(':)');"></td><td>:)</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/biggrin.gif" alt=":D" onclick="addCode(':D');"></td><td>:D</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/supergrin.gif" alt=":e" onclick="addCode(':e');"></td><td>:e</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/wink.gif" alt=";)" onclick="addCode(';)');"></td><td>;)</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/tongue.gif" alt=":p" onclick="addCode(':p');"></td><td>:p</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/devel.gif" alt="§sly" onclick="addCode('§sly');"></td><td>§sly</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/alarmed.gif" alt=":o" onclick="addCode(':o');"></td><td>:o</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/rolleyes.gif" alt=":roll" onclick="addCode(':roll');"></td><td>:roll</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/devilgrin.gif" alt="§evil" onclick="addCode('§evil');"></td><td>§evil</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/grumpy.gif" alt=":(" onclick="addCode(':(');"></td><td>:(</td>
    </tr>
<tr><td><img src="http://www.tydal.nu/aasah/img/smilies/angry.gif" alt=":mad" onclick="addCode(':mad');"></td><td>:mad</td>
    <td><img src="http://www.tydal.nu/aasah/img/smilies/dead.gif" alt=":x" onclick="addCode(':x');"></td><td>:x</td>
    </tr>
</table><p><form method="POST" name="newPost" action="textAreaTst.php" ><br>
<table class="karm">
<tr><td>Subject(Optional): </td><td><input type="text" name="subject" value=""></td></tr>
<tr><td colspan=2>Write your comment (below)</td></tr>
<tr><td colspan=2><textarea id="newest" name="newest" rows=15 cols=60></textarea></td></tr>
</table>
<input class="buttonColorG" type="submit" name="submitPost" value="Post it!" ><br><br>
</form>
```

Permalänk: https://www.webforum.nu/p/2029279

## #7 — aasah, 2007-09-18T08:56Z

Snyggt! Då funkar det! Tackar! :e

Permalänk: https://www.webforum.nu/p/2029283

---

Tråden på webben: https://www.webforum.nu/amne/javascript/164606-klickbara-smileys-hur
