자바 스크립트가 출력을 중복 출력합니다.

Question

내 코드에 작지만 별난 문제가 있습니다. 기본적으로 나는 그것이 호출 될 때 함수를 실행하고리스트를 보여주는 페이지를 가지고있다.

function showlist (arg) { 

var len = arg; 
if (len == 0) { 
    $('#adminlist').empty(); 
    $('#adminlist').append('<li>No records found!</li>') 
    $('#adminlist').append('<li><a id="newadmin">Add New..</a></li>') 
      $('#adminlist').listview("refresh"); 
} else { 
    // some other list 

}; 

}};

"lenght is 0"인 경우 목록에 if 절이 있고 그 다음에 다른 목록이 있으면 하나의 목록이 표시됩니다.

목록에있는 항목 중 하나를 클릭하면 트리거되는 Jquery Mobile Popup이 있습니다.

$("#newadmin").on('click', function(event) { 

    $("#adminname").val(""); 
    $("#popupNewAdmin").popup({overlayTheme: "a"}); 
    $("#popupNewAdmin").popup("open") 

    $("#save_new_admin_btn").on('click', function(){ 
     var newadminname = $("#adminname").val(); 
     var newadminnametrim = $.trim(newadminname); 

     console.log('New Admin Name: ' + newadminnametrim); 
    }) 

});

팝업이 발생하면 입력 텍스트 상자가 지워지고 "save_new_admin_btn"버튼을 클릭하면 콘솔에 텍스트 상자에있는 텍스트가 출력됩니다.

문제는 닫기를 닫고 두 번 버튼을 클릭 한 후 팝업을 다시 열면 다음에 버튼을 클릭 할 때 엄청난 양의 항목이 출력된다는 것입니다.

나는 나 자신을 충분히 분명하게하고 싶다.

미리 감사드립니다. :)

Answer 1

문제는 당신이 범위를 벗어난 두 번째 이벤트를 가지고 저장 버튼이 존재하지 않을 경우 그것을 더 높은 선택을 제공하는 이벤트 핸들러에게 당신이 #newadmin

클릭 할 때마다 추가하는 것입니다 #newadmin을 클릭 할 때까지 당신은 .. 외부로 내부 클릭 이벤트를 이동하여 이벤트를 중첩하는

$("#newadmin").on('click', function(event) { 

    $("#adminname").val(""); 
    $("#popupNewAdmin").popup({overlayTheme: "a"}); 
    $("#popupNewAdmin").popup("open") 



}); 

$(document).on('click', "#save_new_admin_btn", function(){ 
     var newadminname = $("#adminname").val(); 
     var newadminnametrim = $.trim(newadminname); 

     console.log('New Admin Name: ' + newadminnametrim); 
    }) 

Answer 2

에 .. 은 또한 정적 부모 컨테이너에 이벤트를 연결하여 동적으로 .. 그래서 위임 이러한 이벤트을 요소를 추가 할 것으로 보인다.