jQuery text() 함수를 올바르게 사용하는 방법은 무엇입니까?

Question

이 텍스트 영역에 이모티콘을 넣을 텍스트 영역과 그림 이모티콘 목록을 만들고 싶습니다. jquery로 만들려고합니다.

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

그러나 "mm : 그래서 여기 내 기능입니다, 나는이"리 "를 클릭하면

<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> 

내가 텍스트 영역에서이 이미지를 붙여 싶습니다 나는이 같은 UL 요소가 있습니다 "var은 비어 있습니다! 내가 잘못하고있는 곳? 감사합니다.

Answer 1

이미지는 텍스트 노드가 아닌 이미지 요소입니다.

.html()을 사용하면 이미지의 HTML 소스 코드를 가져 와서 텍스트 영역에 넣을 수 있습니다.

.find('img').attr('alt')을 사용하여 이미지 대체 텍스트를 얻을 수 있습니다 (사용자의 인쇄 할 수없는 문자가있는 것 같지만).

텍스트 영역에 이미지를 표시 할 수 없습니다.

Answer 2

html() 또는 innerHTML 또는 textContent()을 사용할 수 있습니다. 그러면 텍스트 영역에 표시 할 html 데이터가 표시됩니다. 당신이 $('img').attr('src'); 같은 이미지 div 대신에 .get 속성 scr을 사용하고 싶다면 div와 함께 img 태그를 만드십시오.

Answer 3

text() 함수는 태그 내부의 텍스트를 봅니다. 태그에 텍스트가 없으며 문자가 alt 인 이미지가 있습니다. 이 속성을 사용하여 속성을 가져옵니다.

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

그러나 예에서는 문자가 인쇄 가능하지 않으므로 대부분의 브라우저에서 사각형 상자로 표시됩니다.