<JSP> 체크 박스 클릭시 리스트 영역 데이터 넣고 빼기

아래의 코드를 보다보면 jquery remove() 함수를 이해할수 있다.

 

function fn_clkEvent(elem){
        $('.no-data-wrap').hide();
        $('.request-list-wrap').show();

        var _text = $(elem).text();
        var _id =$(elem).attr("for");
        var gbl  = ( $(".selected-request-list").length != 0 );

        var bl = false;

        $('.remove').each(function(){
            if(_id==$(this).val()){
                bl = true;
                $(this).parent().remove();
                if($('button[name=tier3]').length===0) {
                    $('.request-list-wrap').hide();
                    $('.no-data-wrap').show();
                }
                return false;
            }
        });

        if(!bl) {
            if($("input:checkbox[id='" + _id + "']").is(":checked") == false){
                if(!gbl) {
                    var r="";
                    r+='<ul class="selected-request-list">';
                    r+='<li>'+ _text +' <button class="remove" value="'+ _id +'" name="tier3" onclick="fn_clkdelEvent(this);"><spring:message code="code.m20024" /></button></li>'; //삭제 
                    r+='</ul>';
                    $('#wrapAppend').append(r);
                    gbl=true;
                } else {
                    var r="";
                    r+='<li>'+ _text +' <button class="remove" value="'+ _id +'" name="tier3" onclick="fn_clkdelEvent(this);"><spring:message code="code.m20024" /></button></li>'; //삭제
                    $('.selected-request-list').append(r);
                }

            }
        }
    }


    // 비교대상항목 x(닫기) 버튼 클릭시 이벤트
    function fn_clkdelEvent(elem){
        console.log("fn_clkdelEvent");
    	if($('button[name=tier3]').length===1) {
            var _value = $(elem).attr('value');
            $(elem).parent().remove();
            $('.request-list-wrap').hide();
            $("input:checkbox[id='" + _value + "']").prop('checked', false);
            $('.no-data-wrap').show();

        } else {
            var _value = $(elem).attr('value');
            $(elem).parent().remove();
            $("input:checkbox[id='" + _value + "']").prop('checked', false);
        }
    }