emoticon toevoegen aan een textarea
ik heb een probleem met men JavaScript scriptje.
ik wil emoticons laten toevoegen aan een text area. alles zou in orde zijn maar toch voegt hij mijn emoticon niet toe. heb op internet aant zoeken geweest om men fout te vinden maar nog niks gevonden.
http://dinotales.net78.net/test.php
als je op de link klikt kan je de broncode opvragen en daar staat alles in. kunnen jullie mij helpen ??
Bij textarea.onfocus krijg ik:
>> Uncaught ReferenceError: storeCaret is not defined | test.php:236
En bij het klikken op de emoticon krijg ik:
>> Uncaught ReferenceError: emoticon is not defined
@Bo Ter Ham dat is omdat het menu een apart bestand is. omdat dit bestand gemaakt is met fireworks heeft fireworks er html tags in geplaatst.
Toevoeging op 01/01/2013 16:26:06:
ik heb nog wat aan het zoeken geweest nu krijg ik een andere foutmelding.
eerlijk snap ik het niet meer ben ik nu fout bezig :'(
nu krijg ik dit:
Uncaught TypeError: Cannot read property 'bericht' of undefined
???
En fireworks HTML laten maken? Dan zou ik direct stoppen met het gepruts waarmee je bezig bent. Of leer goed HTML, CSS en JS en maak alles zelf of laat een ander het maken, maar ga niet een programma je scripts laten maken, dat gaat nooit werken.
nu ik weet dat html laten maken door een programme niet goed is. maar had een cursus gevonden over fireworks.
en zo ben ik aan dit menu geraakt. maar het vorige menu was het zelfde aleen had ik dit zelf geschreven in html en css.
de bedoeling is nu wel dat ik dit terug opnieuw schrijf maar dan zonder programma's. (ben ook nog maar een beginneling ;) ).
maar apprecieer zeker commentaar en tips .
html:
<body>
<p>Type a comment: <br /> <textarea id="comment"></textarea></p>
<p>
Add emoticon:
<img class="emoticon" src="0004.gif" value=":B" />
<input class="emoticon" type="button" value=":(" />
<input class="emoticon" type="button" value=":D" />
</p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js.js"></script>
</body>
</html>
jquery:
$(document).ready(function() {
$('.emoticon').click(function() {
var textarea_val = jQuery.trim( $ ('#comment').val());
var emoticon_val = $ (this).attr('value');
if (textarea_val == '') {
var sp = '';
} else {
var sp = ' ';
}
$('#comment').focus().val(jQuery.trim(textarea_val + sp + emoticon_val + sp));
});
});
nu alles is goed en werkt maar ik krijg in plaats van de afbeelding aleen zoiets :)
maar de afbeelding niet. hoe kan ik de afbeelding erin krijgen?
Code (php)
1
<div contentEditable="true">
gebruiken...dat is hoe wysiwyg editors het doen ;)
Gewijzigd op 04/01/2013 13:11:59 door - Ariën -
@ Henze berkheij dus de dit heb ik dus als volgt:
<!--textarea -->
<p>Type a comment: <br /> <textarea id="comment" contentEditable="true"></textarea></p>
<!-- emoticons -->
<p>
Add emoticon:
<img class="emoticon" src="0001.gif" value=";)" />
<img class="emoticon" src="0002.gif" value=":D" />
<img class="emoticon" src="0003.gif" value=":)" />
<img class="emoticon" src="0004.gif" value="B)" />
<img class="emoticon" src="0005.gif" value=":(" />
<img class="emoticon" src="0006.gif" value=":s" />
</p>
@Aar: waar zou ik de HTML in moeten zetten, contentEditable="true" waar zou ik dat moeten doen????
oke ik vraag mss veel :D maar daar leren we van zeker :D
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
<p>Type a comment: <br /> <div id="comment" contentEditable="true">
vanaf nu is deze content editable zodra je op een emoticon klikt bijvoorbeeld ;) plaats jij hier op de plek waar je hem wilt hebben de <img class="emoticon" src="0001.gif" value=";)" /> in
</div></p>
<!-- emoticons -->
<p>
Add emoticon:
<img class="emoticon" src="0001.gif" value=";)" />
<img class="emoticon" src="0002.gif" value=":D" />
<img class="emoticon" src="0003.gif" value=":)" />
<img class="emoticon" src="0004.gif" value="B)" />
<img class="emoticon" src="0005.gif" value=":(" />
<img class="emoticon" src="0006.gif" value=":s" />
</p>
vanaf nu is deze content editable zodra je op een emoticon klikt bijvoorbeeld ;) plaats jij hier op de plek waar je hem wilt hebben de <img class="emoticon" src="0001.gif" value=";)" /> in
</div></p>
<!-- emoticons -->
<p>
Add emoticon:
<img class="emoticon" src="0001.gif" value=";)" />
<img class="emoticon" src="0002.gif" value=":D" />
<img class="emoticon" src="0003.gif" value=":)" />
<img class="emoticon" src="0004.gif" value="B)" />
<img class="emoticon" src="0005.gif" value=":(" />
<img class="emoticon" src="0006.gif" value=":s" />
</p>
Henze Berkheij bedankt alles werkt nu. bedankt aan iedereen die mij geholpen heeft.