함수의 자바 스크립트가 제대로 작동하지 않습니다.

Question

confirmation message box을 this plugin으로 작성했습니다.

<input type="button" id="delete" value="Delete All" /> 
<input type="button" id="deleteByID" value="Delete Item By ID" /> 

나는 각 버튼을 클릭

, 그것은 메시지 상자를 생성 할 callMessageBox() 전화 및 메시지 상자의 ID 버튼 이름으로 동적입니다. message box이 전화를 거친 후 을 호출하기 위해 actionOnMsgBox이 실행됩니다.

function messageBox(btnID, heading, confirmMsg, cancelMsg){ 
    var box = ' <div id="modal"><div id="heading">'+heading+'</div><div id="content"> <a href="#" id="'+ btnID + 'revealYes" class="button green close"><img src="images/tick.png">'+confirmMsg+'</a> <a href="#" id="'+btnID+'revealNo" class="button red close"><img src="images/cross.png">'+cancelMsg+'</a>'; 
    return box; 
} 
function callMessageBox(btnID, heading, confirmMsg, cancelMsg){ 
    if($('#modal').length == 0) 
     $('body').append(messageBox(btnID,heading,confirmMsg,cancelMsg)) 
      $('#modal').reveal({ 
       animation: 'fade', 
       animationspeed: 320, 
       closeonbackgroundclick: true, 
       dismissmodalclass: 'close' 
      }); 
} 

function actionOnMsgBox(btnID,callback,item){ 
    $(document).on('click','#'+ btnID +'revealYes,#'+ btnID +'revealNo',function (e) { 
     var choice = $(e.target).attr('id'); 
     if ($(this).attr('id') == btnID + 'revealYes'){ 
      if(typeof item === 'undefined'){ 
       callback(); 
      }else{ 
       callback(item); 
      } 
     } else { 
      return false; 
     } 
    }); 
} 

문제 : 나는 Delete All 버튼을 클릭하면, 다음 messageBox()이 deleterevealYes 및 deleterevealNo를 생성

$('#delete').click(function(){ 
    callMessageBox('delete','Are you sure to delete all items from your cart?','Yes','No'); 
}); 
actionOnMsgBox('delete',deleteAllItemInCart); 

$('#deleteByID').click(function() { 
    callMessageBox('deleteByID','Are you sure to delete this item from your cart?','Yes','No'); 
}); 
actionOnMsgBox('deleteByID',deleteItemInCart,item1); 

이들은

내 기능입니다. 그러나 Delete Item By ID을 클릭했을 때 messageBox()은 여전히 ​​ #deleterevealYes과 #deleterevealNo을 생성했는데 예상 한 결과는 #deleteByIDrevealYes과 #deleteByIDrevealYes입니다.

어떤 원인 일 수 있습니다. 감사.

Answer 1

아래 기능을 변경하십시오. 공개 기능에 대한 고유 한 ID를 제공하십시오. 동일한 ID가 주어진다면, 첫 번째는

function messageBox(btnID, heading, confirmMsg, cancelMsg){ 
    var box = ' <div id="modal'+btnID+'"><div id="heading">'+heading+'</div><div id="content"> <a href="#" id="'+ btnID + 'revealYes" class="button green close"><img src="images/tick.png">'+confirmMsg+'</a> <a href="#" id="'+btnID+'revealNo" class="button red close"><img src="images/cross.png">'+cancelMsg+'</a>'; 
    return box; 
} 

function callMessageBox(btnID, heading, confirmMsg, cancelMsg){ 
    if($('#modal'+btnID).length == 0) 
     $('body').append(messageBox(btnID,heading,confirmMsg,cancelMsg)) 
      $('#modal'+btnID).reveal({ 
       animation: 'fade', 
       animationspeed: 320, 
       closeonbackgroundclick: true, 
       dismissmodalclass: 'close' 
      }); 
} 

Answer 2

내가 ($ ('# 모달'). 길이 == 0) 문제 만 모든 요소에 대해 하나 개의 사업부를 추가 을 일으키는 지 생각 항상 실행됩니다 특정 ID에 대한 내용을 건너 뛰십시오