[Window_Object] JS - confirm() 메서드 ★ - 확인창 (= confirm메서드 = 컨펌메서드 = confirm함수 = 컨펌함수) ※ 링크 이동 전 확인창 띄우기

1. confirm() 예제 - 링크 이동 전 확인창 띄우기
2. confirm() 정의
3. confirm() 구문
4. confirm() 예제 - 확인창 띄운 후, 폼 넘기기
5. confirm() 예제 - 회원탈퇴 할 건지 확인하기
6. 버튼 옆에 확인 메세지 띄우기

confirm() 예제 - 링크 이동 전 확인창 띄우기 

[방법1]

 

<button onclick="confirmLink()">홈짱닷컴 바로가기</button>

<script>

function confirmLink() {

  if (confirm("진짜로 가볼텨?")) {

    window.location.href = "https://homzzang.com";

  }

}

</script>

 

결과보기

---

[방법2]

<a href="https://homzzang.com" target="_blank" onclick="return handleClick();">홈짱닷컴 바로가기</a>

<script>

function handleClick() {

    if (confirm("진짜로 갈거야?")) {

        return true;  // 이동 O

    } else {

        return false; // 이동 X

    }

}

</script>

 

결과보기

---

[방법3]

 

<a href="https://homzzang.com" target="_blank" onclick="if (confirm('진짜로 갈거야?')) { return true; } else { return false; }">홈짱닷컴 바로가기</a>

 

결과보기 

confirm() 정의

 

확인 취소 버튼 달린 확인메세지창 띄우기

 

---

 

1.

과도하게 사용 시 사용자에게 불편 초래하니 주의 ! 

 

2.

(확인・취소) 버튼만 가능.

(예・아니오) 버튼으로 커스텀 불가.

대신, 모달 또는 팝업 플러그인 이용. 

 

3.

주요 브라우저가 모두 지원.

 

confirm() 구문

 

confirm(message)

 

---

[매개변수]

 

message

필수. 메세지 내용

 

---

[반환값]

 

• 확인 (OK) 클릭 시, TRUE 반환.
• 취소 (Cancel) 클릭 시, FALSE 반환.

 

confirm() 예제 - 확인창 띄운 후, 폼 넘기기

 

function homzzang() {

    if (confirm("다음으로 넘기겠습니까?") == true) {

        var fm = document.forderlist;

        fm.target = "hiddenframe";

        fm.action = "orderlist_complete.php";

        fm.method = "post";

        fm.submit();

    } 

}

 

럭키진영 님 (201215) https://sir.kr/qa/389820

PS. 현재창에서 넘기려면, 빨간색 코드 삭제.

confirm() 예제 - 회원탈퇴 할 건지 확인하기

※ 회원탈퇴 할 건지 묻고, 탈퇴 원하면 탈퇴처리 페이지로 보냄.

 

<script>

function member_leave(){

var cf = confirm('진짜로 회원탈퇴 ?');

if(cf){

   location.replace("<?php echo G5_BBS_URL; ?>/member_confirm.php?url=member_leave.php");

}

}

</script>

 

버튼 옆에 확인 메세지 띄우기

[방법1] - css() 메서드 이용

 

<script src="http://code.jquery.com/jquery-latest.js"></script>

<button id="submit">버튼</button>

<span id="ok" style="display: none;">작성완료</span>

<script>

$(document).ready(function() {

    $('#submit').click(function(){

        $('#ok').css('display','');

    });

});

</script>

 

결과보기

---

[방법2] - after() 메서드 이용

 

<style>

span {margin-left:15px;}

</style>

<script src="http://code.jquery.com/jquery-latest.js"></script>

<button id="submit">버튼</button>

<script>

$(document).ready(function() {

    $('#submit').click(function(){

        $(this).after("<span>작성완료</span>");

    });

});

</script>

 

결과보기

PS. 추천/비추천 전 확인. (201003) https://sir.kr/qa/379385