我想制作一个textarea和表情符号列表,将emojis放入这个textarea。 我试图用jquery做它。 我有一个像这样的ul元素:
<textarea id="TxtEmoji" class="textemoji" placeholder="Type a message here"></textarea>
button type="button" id="BtnEmoji" class="btnemoji">😀</button>
<ul class="emoji-list">
<li><img class="emoji" draggable="false" alt="" src="http://twemoji.maxcdn.com/16x16/1f33e.png"></li>
</ul>
当我点击这个“li”时,我想将这个图像粘贴到textarea中,所以这是我的功能:
$(".emoji-list li").click(function () {
var mm = $(this).text();
var textVal = $("#TxtEmoji").val();
$("#TxtEmoji").val(textVal + mm);
});
但“mm”var是空的!我在哪里做错了? 谢谢!
答案 0 :(得分:3)
图像是图像元素,而不是文本节点。
您可以使用.html()
获取图片的HTML源代码并将其放在文本区域中。
您可以使用.find('img').attr('alt')
来获取图片的替代文字(尽管您似乎有非打印字符)。
您无法在文本区域中显示图像。
答案 1 :(得分:0)
您可以使用html()
或innerHTML
或textContent()
。您将获得要在文本区域中显示的html数据。如果你想显示图像,请使用div
替换.get属性scr,如$('img').attr('src');
,并使用此构造img
标记以在div中显示。
答案 2 :(得分:0)
text()
函数查看标记内的文本。您的代码没有文字,它有一个alt
属性的图片。使用它来获取属性。
$(".emoji-list li img").click(function () {
var mm = $(this).attr("alt");
var textVal = $("#TxtEmoji").val();
$("#TxtEmoji").val(textVal + mm);
});
但是在您的示例中,该字符不可打印,因此在大多数浏览器中它将显示为方框。