[자바스크립트] confirm() 주의할 것

http://whiteship.tistory.com/2408

<%@ tag pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ attribute name="url" required="true" %>

<a id="btn_stop" href="<c:url value="${url}"/>"><img src="<c:url value="/images/study/stop.png"/>"/></a>

<script type="text/javascript">
$(document).ready( function(){
    $("#btn_stop").click( function() {
        if(confirm("종료 하시겠습니까?")) {
            $(this).parent().click();
        }
    });
});
</script>

분명히 confirm 팝업에서 "취소"를 눌렀는데도 그냥 진행이 되버리더군요. @_@;; 왜 이러나.. 싶어서 봄싹에 올렸더니 역시.. 성윤군이 원인과 해결책까지 제공! 캬~~ 어서 봄싹에 StackOverFlow 짭퉁 NullPE(NullPointerException) 메뉴를 추가해야 할텐데 말이죠.

원인은 간단하더군요. a 링크를 클릭할 때 이벤트를 등록했으니... 이벤트 처리하고 나서 링크 클릭한거 처리하느라 그렇게 된거더군요.

해결책도 역시 초간단...

$(document).ready( function(){
    $("#btn_stop").click( function() {
        if(confirm("종료 하시겠습니까?")) {
            $(this).parent().click();
        } else {
            return false;
        }
    });
});

else문 추가하고 false를 반환하면 끝. 크핫; 

방법이 여러 개더군요.

    $("#btn_stop").click( function() {
        if(confirm("종료 하시겠습니까?") == false) {
            return false;
        }
    });

    $("#btn_stop").click( function(e) {
        if(confirm("종료 하시겠습니까?") == false) {
            e.preventDefault();
        }
    });

    $("#btn_stop").click( function(e) {
        return confirm("종료 하시겠습니까?");
    });

결국은 맨 마지막 걸로 고쳤습니다.