• 회원가입
  • 로그인
  • 구글아이디로 로그인

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

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

 

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

 

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


<script>

function confirmLink() {

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

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

  }

}

</script>

 

결과보기

 

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

방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Basic JS - Home (JS입문) + Javascript Framework (프레임워크) 종류
Basic JS - Intro (JS소개)
Basic JS - Where To (JS위치) - JS구문 / JS코드위치 / JS사용법 ※ JS외부링크 주의사항
Basic JS - Output (JS출력= JS쓰기) ★★★★★ document.write() = 다큐먼트라이트
Basic JS - Syntax (JS구문) ★
Basic JS - Statement (JS구문= JS명령문)
Basic JS - Comment (JS주석)
Basic JS - Variable (JS변수) ★★★★★
Basic JS - Operator (연산자) - JS연산자 ★★★★★
Basic JS - Data Type - 데이터유형 ★★★★★ (= 데이터형식 = 데이터타입 = 데이터종류 = 자료형…
Basic JS - Function - JS함수 ★★★★★ ※ 일반함수 특징 2
Basic JS - Object - JS객체 ★★★★★
Basic JS - Scope - JS유효범위 (= JS접근범위 = 변수 종류) ★★★★★★★★★★
Basic JS - Event - JS이벤트 (= JS코드실행방법) ★★★★★
Basic JS - Strings - JS문자열
Basic JS - String Methods - JS문자열메서드
Basic JS - Number - JS숫자
Basic JS - Number Method - JS숫자메서드
Basic JS - Math 객체 - JS수학객체 (= JS산수객체 = Math객체 = Math Object = 매스 …
Basic JS - Dates - JS날짜
1/67
목록
찾아주셔서 감사합니다. Since 2012