클릭시 이벤트를 수행 할 수 없습니다.

Question

http://jsfiddle.net/Xtreu/ 링크를 참조하여 모든 양식을 사용하지 않고 "내 데이터 삭제"버튼 이벤트에서 동일한 기능을 수행하려고합니다. 나는 다른 방법으로 시도했지만 일어난 일이 아닙니다. 클릭 이벤트와 함께 동일한 예제를 수행하는 방법을 알려줄 수 있습니까?

HTML :

<form method="post" action="/echo/html/"> 
    <input type="hidden" name="html" value="&lt;p&gt;Your data has been deleted&lt/p&gt;" /> 
    <input type="submit" value="Delete My Data" /> 
</form> 
<div id="confirmBox"> 
    <div class="message"></div> 
    <span class="button yes">Yes</span> 
    <span class="button no">No</span> 
</div> 

자바 스크립트를

function doConfirm(msg, yesFn, noFn) { 
    var confirmBox = $("#confirmBox"); 
    confirmBox.find(".message").text(msg); 
    confirmBox.find(".yes,.no").unbind().click(function() { 
     confirmBox.hide(); 
    }); 
    confirmBox.find(".yes").click(yesFn); 
    confirmBox.find(".no").click(noFn); 
    confirmBox.show(); 
} 

$(function() { 
    $("form").submit(function (e) { 
     e.preventDefault(); 
     var form = this; 
     doConfirm("Are you sure?", function yes() { 
      form.submit(); 
     }, function no() { 
      // do nothing 
     }); 
    }); 
}); 

Answer 1

form

를 사용하지 않고 코드가이 예제를 시도

<div id="msg" style="display:none">Your data has been deleted</div> 
<input type="button" id="d_btn" value="Delete My Data" /> 
<div id="confirmBox"> 
    <div class="message"></div> <span class="button yes">Yes</span> 
<span class="button no">No</span> 

</div> 

스크립트

function doConfirm(msg, yesFn, noFn) { 
    var confirmBox = $("#confirmBox"); 
    confirmBox.find(".message").text(msg); 
    confirmBox.find(".yes,.no").unbind().click(function() { 
     confirmBox.hide(); 
    }); 
    confirmBox.find(".yes").click(yesFn); 
    confirmBox.find(".no").click(noFn); 
    confirmBox.show(); 
} 

$(function() { 
    $("#d_btn").click(function (e) { 
     e.preventDefault(); 
     var form = $(this).closest('form'); 
     doConfirm("Are you sure?", function yes() { 
      $('#d_btn').hide() 
      $('#msg').show() 
     }, function no() { 
      // do nothing 
     }); 
    }); 
}); 

DEMO 나는 당신의 JSFiddle 업데이트

Answer 2

이

당신의 HTML을 시도

<form method="post" action="/echo/html/" id="frm"> 
    <input type="hidden" name="html" value="&lt;p&gt;Your data has been deleted&lt/p&gt;" /> 
    <input type="button" id='btnSubmit'value="Delete My Data" /> 
</form> 
<div id="confirmBox"> 
    <div class="message"></div> 
    <span class="button yes">Yes</span> 
    <span class="button no">No</span> 
</div> 

당신의 JS 코드 :

코드에서 단추 유형이 제출되어서 일반 단추로 변경 했으므로 양식에 ID를 입력하고 단추를 제출했습니다. 여기