jquery를 사용하여 목록에 항목 추가

Question

나는 알아낼 수없는 간단한 질문을했습니다. 이 코드 함께 일하고 :

http://jsfiddle.net/spadez/ZTuDJ/32/

// If JS enabled, disable main input 
$("#responsibilities").prop('disabled', true); 
// $("#responsibilities").addClass("hidden"); 

// If JS enabled then add fields 
$("#resp").append('<input placeholder="Add responsibility" id="resp_input" ></input><input type="button" value="Add" id="add"> '); 

// Add items to input field 
var eachline=''; 
$("#add").click(function(){ 
    var lines = $('#resp_input').val().split('\n'); 
    var lines2 = $('#responsibilities').val().split('\n'); 
    if(lines2.length>10)return false; 
    for(var i = 0;i < lines.length;i++){ 
     if(lines[i]!='' && i+lines2.length<11){ 
     eachline += lines[i] + '\n'; 
     }  
    } 

     $('#responsibilities').text($("<div>" + eachline + "</div>").text()); 

    $('#resp_input').val(''); 
}); 

아이디어는 당신이 책임 필드에 뭔가를 입력하고이 텍스트 영역에 삽입됩니다 있다는 것입니다.

<li>inserted item 1</li> <li>inserted item 2</li>

내가 자바 스크립트 정말 새로 온 사람 만이 있었다 : 내가 또한하고 싶은 항목이 텍스트 영역에 삽입 때이 같은 목록 형식으로 위를 출력한다이다

$("#resp").append('<li> +eachline </li> ') 

Answer 1

$('#responsibilities').text($("<div>" + eachline + "</div>").text()).before("<li>"+lines+"</li>"); 

데모 --->http://jsfiddle.net/ZTuDJ/34/

Answer 2

나는 이미 고정 일 : 정보에 따라 그것에 최선 자상 온라인으로 발견 이전 질문에서 당신을 위해.

Jquery adding items to a list without reloading page

http://jsfiddle.net/blackjim/VrGau/15/

var $responsibilityInput = $('#responsibilityInput'), 
    $responsibilityList = $('#responsibilityList'), 
    $inputButton = $('#addResp'), 
    rCounter = 0; 

var addResponsibility = function() { 
    if(rCounter < 10){ 
     var newVal = $responsibilityList.val()+$responsibilityInput.val(); 
     if(newVal.trim()!==''){ 
      var newLi = $('<li>'); 
      $('ul#respList').append(newLi.text(newVal)); 
      $responsibilityList.val(''); 
      rCounter+=1;  
     } 
    } 
} 

$inputButton.click(addResponsibility); 

Answer 3

http://jsfiddle.net/pjdicke/ZTuDJ/35/

그런 다음

$('#responsibilities').text($("<div>" + eachline + "</div>").text()); 

// add this line after above 
$('<li>' + lines + '</li>').appendTo('#list'); 

다음은이를 추가 <ul>을 만들어야합니다