Question

我想制作一个textarea和表情符号列表，将emojis放入这个textarea。我试图用jquery做它。我有一个像这样的ul元素：

<textarea id="TxtEmoji" class="textemoji" placeholder="Type a message here"></textarea>
button type="button" id="BtnEmoji" class="btnemoji">&#x1F600;</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是空的！我在哪里做错了？谢谢！

Answer 1

图像是图像元素，而不是文本节点。

您可以使用.html()获取图片的HTML源代码并将其放在文本区域中。

您可以使用.find('img').attr('alt')来获取图片的替代文字（尽管您似乎有非打印字符）。

您无法在文本区域中显示图像。

Answer 2

您可以使用html()或innerHTML或textContent()。您将获得要在文本区域中显示的html数据。如果你想显示图像，请使用div替换.get属性scr，如$('img').attr('src');，并使用此构造img标记以在div中显示。

Answer 3

text()函数查看标记内的文本。您的代码没有文字，它有一个alt属性的图片。使用它来获取属性。

$(".emoji-list li img").click(function () {  
    var mm = $(this).attr("alt");  
    var textVal = $("#TxtEmoji").val(); 
    $("#TxtEmoji").val(textVal + mm);     
});

但是在您的示例中，该字符不可打印，因此在大多数浏览器中它将显示为方框。

如何正确使用jQuery text（）函数？

3 个答案: