목록에서 값을 제거하십시오.

Question

나는 일련의 확인란을 눌러 실행중인 값 목록을 가지고 있습니다. 확인란의 선택을 취소하면 값이 목록에서 제거됩니다. 이 작품은 잘 작동합니다.

또한 옵션을 선택하면 텍스트가 선택한 섹션에 추가됩니다. 옵션 선택을 취소하면 해당 선택 사항 옵션이 제거되기를 원합니다. 선택한 옵션이 삭제 된 경우 확인란의 선택을 취소하고 실행중인 목록에서 값을 제거해야합니다.

$(".myCheckboxClass").change(function() {  
    var list = $('#bodyIDList').data('value'); 
    if($(this).is(":checked")) {list.push($(this).val());   
    var text = $('label[for=' + $(this).val() + ']').text();  
    $("#selectedListSelected").append('<label></label>'); 
    $("#selectedListSelected").append('<ul class="options"><li onclick="this.parentNode.removeChild(this);">' + text + '</li></ul>');   
    } else { 
    var index = list.indexOf($(this).val());   
    list.splice(index, 1);     
    $(this).closest('ul').remove();   
    }  
    $("#bodyIDList").val(list); 
}); 

Answer 1

새 선택을 추가 한 후 배열에서 색인 번호가 무엇인지 확인하십시오. 그런 다음 UL 태그에 사용자 정의 클래스를 할당 할 수 있습니다. 짧은 jQuery를 선택을 할 수 있도록

var arrPosition = 'arr' + list.indexOf($(this).val()); 
$("#selectedListSelected").append('<ul class="options ' + arrPosition +'"><li onclick="this.parentNode.removeChild(this);">' + text + '</li></ul>'); 

당신이 배열에서 값을 삭제, 인덱스를 알고 : 당신의 배열 인덱스가 7 인 경우에 당신은 당신의 UL에 "arr7"와 같은 클래스를 추가 할 수 있습니다 올바른 UL 노드를 가져 와서 삭제하십시오.

var arrPosition = 'arr' + index;  
$('ul.' + arrPosition).remove();