닫기 jQueryUI 모달 새로 고침 페이지 닫기

Question

내 jQueryUI 모달에서는 버튼을 클릭 할 때마다 preventDefault() 또는 return false 일 때도 부모 페이지가 새로 고침됩니다. 이 예상되는 동작입니까?

html로 :

<li><a id="addFunds" class="no-close" href="#">Add Funds</a></li> 

모달 :

<div id="addFundsModal" class="modal-hidden" title="Add Funds to Your Account"> 
    <div class="leftBar"> 
     <h3>Add Funds</h3> 
       //other stuff 
       <form> 
         //<fieldset>, etc. 
         <button class="modal-close btnBlue" href="#">Cancel</button> 
       <button class="add-funds btnGreen">Add Funds</button> 
     </form> 
    </div> 
</div> 

JQuery와 : 나는 또한 내가 dialog.close 또는 dialog.destroy을 사용할지 여부에 대해 확실하지 않다

$('#loggedInDropdown').on('click', '#addFunds', function(e) { 
     e.preventDefault(); 
     $('#addFundsModal').dialog({ 
      modal: true, 
      dialogClass: 'no-close', 
      width: 500 
     }); 
    }); 

    $('.ui-dialog').on('click', '.modal-close', function(e) { 
     e.preventDefault(); 
     $('#addFundsModal').dialog('close'); 
    }); 

하지만, 그것은 다른 게시물에 대한 것입니다.

당신의 문제는 이벤트 위임에

.dialog({ 
     resizable: false, 
     height:240, 
     modal: true, 
     buttons: { 
     "Delete all items": function() { 
      $(this).dialog("close"); 
     }, 
     Cancel: function() { 
      $(this).dialog("close"); 
     } 
     } 
    }); 

Answer 1

우리는 보통 .dialog 옵션 내부의 버튼 동작을 첨부 링크에서 처음에는 해당 클래스에 이벤트를 첨부해도 효과가 나타나지 않으며 (.ui-dialog은 존재하지 않음) 정상적인 버튼 비헤이비어 양식 제출, 페이지 새로 고침이 적용됩니다.

시도 :

$('#addFundsModal').on('click', '.modal-close', function (e) { 
    e.preventDefault(); 
    $('#addFundsModal').dialog('close'); 
}); 

또는 클래스에 적용 (반드시 더 나은)

$('.modal-hidden').on('click', '.modal-close', function (e) { 
    e.preventDefault(); 
    $('#addFundsModal').dialog('close'); 
}); 

Demo

Answer 2

, 난 .ui-dialog 때문에 실행되지 없구요 취소에 대한 클릭 이벤트를 클릭 첫 번째 시간을 만들어 생각 :