예기치 않은 순서로 코드를 실행하는 jQuery 이벤트

Question

예상치 못한 순서로 실행되는 일부 코드에 문제가 있습니다. click 이벤트에 바인드 된 함수가있는 두 개의 버튼이 있습니다. 하나의 버튼은 '취소'이며 일부 표시가 변경됩니다. 두 번째 버튼은 '완료'되어 숨겨진 입력 필드에 변경 사항을 저장 한 다음 변경 사항을 저장 한 다음 '취소'할 때 이벤트 핸들러를 트리거합니다. 이것이 내 코드의 모습입니다.

/*done link*/ 
$("#donelink").bind('click', function() { 
    var idvalues = $.map($(".ledgerline input:checkbox:checked"), function(el, i) { 
    return $(el).val().toString(); 
}).join(','); 
    $("#my_input").val(idvalues); 
    $("#cancellink").triggerHandler('click'); 
    }); 

/*cancel link*/ 
$("#cancellink").bind('click', function() { 

    /*some basic css and other property changes*/ 

    $(".ledgerline input:checkbox:checked").parent().parent().trigger('click'); 

    }); 

/* The function bound to this event: 
$(".ledgerline input:checkbox:checked").parent().parent().trigger('click'); 
*/ 
function { 
    /* other stuff */ 
    $(this).find("input:checkbox").remove(); 
} 

는 내가 일이 기대하는 내가 '완료'링크를 클릭 할 때 모든 체크 박스에서 값을 찾아 #my_input에 기록하는 것입니다. 그런 다음 취소 링크를 클릭하여 모든 확인란을 제거합니다. 대신에 모든 체크 박스가 먼저 제거 된 다음 빈 문자열이 값으로 기록됩니다.

어떤 도움이 필요합니까? 나는 이것이 왜 일어나고 있는지 이해하지 못한다.

Answer 1

해결했습니다. 문제는 이벤트 핸들러가 다른 곳에서 코드에 의해 두 번 트리거되고 있다는 것이 었습니다. 위에 붙여 넣은 코드는 실제로 정상적으로 작동합니다. 자기를 괴롭 히다

어쨌든 도와 주셔서 감사합니다.

Answer 2

그것은

$("#cancellink").triggerHandler('click'); 

가 실행하기 전에 완료 설정 $.map 이후 값을 기다리고되지 않은이 선 것 같습니다. 계속하기 전에 값이 설정 될 때까지 대기하는 콜백 함수를 도입 할 수 있습니다.

지금까지 코드의 숙신도 데모를 jsbin에 게시하여 살펴볼 수 있습니까? 실행 순서가 보장되지 않는 보조 노트
당신은 특정 순서로 실행하는 이벤트 핸들러에 의존 할 수 없기 때문에

.