jQuery 문자열을 입력 필드에 연결합니다.

Question

문자열을 연결하여 테이블의 td를 클릭하면 텍스트 상자에 표시하려고합니다.

나는 지금까지 이런 짓을 :

$(document).on("click", ".keywordClick", function() { 
      $('.txtKeywords').val($(this).attr('value')); 
     }); 

.keywordClick is td item which contains required string 

그리고

.txtKeywords is the textbox which is empty initially... 

누군가가 캐릭터를 클릭 할 때마다 내가 이렇게 될 그것을 좋아하는 것 :

"Hello world today" => initial click; 

"is a sunny day" => second click; 

그래서를 출력은 다음과 같습니다 :

안녕하세요 세상은 오늘 화창한 날입니다 ... 각 연결된 문자열 사이에 빈 공간이 있어야합니다 ""< < ... 누군가 나를 도울 수 있습니까?

Answer 1

값을 반환 할 함수가있는 .val()의 콜백 함수를 사용할 수 있습니다. 집합의 요소 인덱스 위치와 이전 값을 인수로받습니다. 당신은 이전 값을 사용하여 새로운 가치와 연결된다 :

$(document).on("click", ".keywordClick", function() { 
var appendText = " " + $(this).attr('value'); 
    $('.txtKeywords').val(function(index, oldVal) { 
    return oldVal + appendText; 
    }); 
}); 

Answer 2

 $(".keywordClick").on("click",function() { 
 
     $('.txtKeywords').val($('.txtKeywords').val()+" "+$(this).html()); 
 
    
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
<table> 
 
<tr> 
 
    <th>Data</th> 
 
    </tr> 
 
    <tr> 
 
    <td class="keywordClick">Hello world today</td> 
 
    <td class="keywordClick">is a sunny day</td> 
 
    </tr> 
 
</table> 
 
</div> 
 
<div> 
 
<input type="text" class= "txtKeywords"> 
 
</div>