체크 박스가 선택되었을 때 텍스트 영역에 값을 추가하는 방법

Question

나는 여기에서 발견 한 다음 함수를 사용하고 있습니다. 내 질문과 관련하여 작업을 수행하는 것은 단 한 가지 문제입니다. 사용자가 3-4 개 이상의 확인란을 선택하면 텍스트 영역에 추가 된 일부 텍스트 또는 값이 더 이상 표시되지 않습니다. 상자가 항상 텍스트 영역에 추가되는 텍스트를 확인할 때마다 항상 표시되도록하는 방법이 있습니까? 어떤 도움이라도 대단히 감사합니다.

- 진보!

<input type="text" value="" class="textfield" id="video0_tags" name="video0_tags"> 
<div class="taglist"> 
<label><input type="checkbox" value="2D Animation">2D Animation</label> 
<label><input type="checkbox" value="3D Animation">3D Animation</label> 
<label><input type="checkbox" value="Animatronics">Animatronics</label> 
<label><input type="checkbox" value="Architectural">Architectural</label> 
<label><input type="checkbox" value="Cartoon">Cartoon</label> 
<label><input type="checkbox" value="Cell Animation">Cell Animation</label> 
<label><input type="checkbox" value="Character Animation">Character Animation</label><label><input type="checkbox" value="Cut & Paste">Cut & Paste</label> 
<label><input type="checkbox" value="Doodle">Doodle</label> 
<label><input type="checkbox" value="HDR">HDR</label> 
<label><input type="checkbox" value="High Speed">High Speed</label> 
<label><input type="checkbox" value="Illustration">Illustration</label> 
<label><input type="checkbox" value="Live Action">Live Action</label> 
<label><input type="checkbox" value="Macro">Macro</label> 
<label><input type="checkbox" value="Motion Design">Motion Design</label> 
<label><input type="checkbox" value="Motion Graphics">Motion Graphics</label> 
<label><input type="checkbox" value="Moving Installation">Moving Installation</label> 
</div> 


function updateTextArea() {  
    var allVals = []; 
    $('.taglist :checked').each(function() { 
     allVals.push($(this).val()); 
    }); 
    $('#video0_tags').val(allVals) 
    } 
    $(function() { 
     $('.taglist input').click(updateTextArea); 
     updateTextArea(); 
}); 

Answer 1

텍스트 입력을 textarea으로 변경하면 필요에 따라 자동으로 스크롤 막대가 추가됩니다.

Answer 2

먼저 textarea 요소가 있어야하므로 입력 태그를 textarea로 변경하십시오. 그런 다음 updateTextArea 함수에서 행 속성을 설정하여 그 안에있는 모든 텍스트를 볼 수 있습니다. http://jsfiddle.net/7b5fk/1/

Answer 3

먼저, video0_tags를 텍스트 영역으로 변경하려고합니다. 그런 다음 모든 선택 사항에 따라 텍스트 영역을 업데이트하도록 .click() 이벤트를 각 확인란에 첨부해야합니다.

<textarea id="video0_tags"></textarea> 

$(document).ready(function(){ 
    $(".taglist input").click(function(){ 
     $("#video0_tags").text(''); 
     $(".taglist :checked").each(function(){ 
       $("#video0_tags").append($(this).val() + "\n"); 
     }); 
    }); 
});