Здравствуйте. Имеется такой код для вставки смайликов в текстовое поле
| HTML5 |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| <!DOCTYPE html>
<html>
<head>
<style>
#textarea{background:#FFFFFF;color:black;border:1px solid #C0CAD5;width:328px;min-height:40px;padding:3px 25px 3px 3px;padding-bottom:5px;margin-bottom:3px;outline:0;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;line-height:150%;word-wrap:break-word;cursor:text;}
.emoji{width:20px;height:20px;margin:0px;border:none;vertical-align:top;
}
</style>
</head>
<body>
<div id="smiles">
<img src="smile/1.gif">
<img src="smile/2.gif">
<img src="smile/3.gif">
</div>
<div id="textarea" tabindex="0" contenteditable="true" ondragend="return true"></div>
<script type="text/javascript">
var arr = document.getElementById('smiles').getElementsByTagName('img');
for(var i in arr) {
if(arr.hasOwnProperty(i)) {
arr[i].onclick = function(event) {
if('img' === this.tagName.toLowerCase()) {
var img = ' <img class="emoji" src="'+this.src+'"> ';
document.execCommand('insertHTML', false, img);
}
};
}
}
</script>
</body>
</html> |
|
У меня в php коде имеется отправка POST запроса к определенному сообщению. Я хочу отправлять смайлики и чтобы они сразу же отображались в текстовом поле. В моем коде смайлики отправляются в виде символов : ), в коде что выше смайлики добавляются в текстовое поле, но как отправить их POST запросом мне не понятно, т.к. не силен в JavaScript.
Мой код который отправляет смайлики,
| PHP |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| <form id='submit_wall' name='funforma' >
<p><textarea type='text' name='comment' id='".$row['id']."' value='' style='height:100p' /></textarea>
<p> <input type='hidden' name='messageid' id='".$row['id']."' value='".$row['id']."'></p> <div class='smile'>
<a href='javascript:x()' onclick=\"InsertSmile(':-*')\"><img src='smile/1.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile(':)')\"><img src='smile/2.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile(':(')\"><img src='smile/3.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile(';)')\"><img src='smile/4.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile(':P')\"><img src='smile/5.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile('8)')\"><img src='smile/6.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile(':D')\"><img src='smile/7.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile('=O')\"><img src='smile/9.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile(':-x')\"><img src='smile/10.gif'/></a>
<a href='javascript:x()' onclick=\"InsertSmile('(T_T)')\"><img src='smile/11.gif'/></a>
";
$stena_group .= '<p><a href="javascript:void(0);" onclick="comment( document.getElementById('.$row['id'].').value, '.$row['id'].' );">
Отправить</a> </p>
</form> |
|
Добавление смайликов в textarea
| Javascript |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| var ie=document.all?1:0;
var ns=document.getElementById&&!document.all?1:0;
function InsertSmile(SmileId)
{
if(ie)
{
document.all.comment.focus();
document.all.comment.value+=" "+SmileId+" ";
}
else if(ns)
{
document.forms['funforma'].elements['comment'].focus();
document.forms['funforma'].elements['comment'].value+=" "+SmileId+" ";
}
else
alert("Ваш браузер не поддерживается!");
} |
|
B сама отправка POST на JS
| Javascript |
1
2
3
4
5
6
7
8
9
10
11
12
| function comment(text, message_id){
$.ajax({
type: "POST",
url: "profile.php",
data:"comment=" + text+"&messageid="+message_id,
success: function(){
$("ul#wall").prepend("<li style="display: none;">"+ text +"</li>");
$("ul#wall li:first-child").fadeIn();
}
});
return false;
}; |
|
Этот код отображает смайлики только после перезагрузки страницы, а первоначально это символы. Подскажите пожалуйста, как реализовать чтобы отображались картинки, то есть, прикрутить первый код к моему. Сильно прошу не пинать если не так выразился в сути моей проблемы.
(
