[Javascript] 1. alert 창 띄우고 페이지 이동

 
구현 목적
 

원래 하고 싶었던 구현은
'more' 버튼을 클릭하면 이동하시겠습니까? 라는 alert 창이 뜨고
'확인' 버튼을 누르면 각자 상세페이지로 이동하는 것을 시도해봤다

---

시도 결과
 

내가 배운 <a> 태그로는 안돼서 서치해보니까
location.href 을 쓰라고 나옴
 

 <div class="btncenter">
 	<button class="mybtn mybtn1" onclick="myFunction()">more</button>
  		<script>
 			function myFunction() {
			alret("이동하시겠습니까?")
 			location.href = "details/phw.html"; 
       		}
        </script>
 </div>

 
이렇게 썼는데도 구현이 되지 않았다..
도저히 뭐가 문제인지 모르겠어서
조장한테 물어보고 단숨에 해결해주셨다!

---

 나의 문제점

1. 구현해야 하는 게 총 4개였는데 4개 다 함수를  function myFunction ()으로 넣었다
2. '이동하시겠습니까?' 하는 질문형에는 alert 보다 confirm의 함수가 더 어울린다

++

3. 추가로 발생된 문제점은 취소 버튼을 눌러도 페이지로 이동한다는 것..

이렇게 중복되는 거

 

 
 

---

문제해결

<div class="btncenter">
	<button class="mybtn mybtn1" onclick="myFunction1()">more</button>
		<script>
			function myFunction1() {
			if(confirm("이동하시겠습니까?") == true){
			location.href = "details/phw.html"; 
  			}
            else {
      		return ;    
           }
         }
		</script>
</div>

 
1. 각각의 함수마다 뒤에 숫자를 붙여 구분해주었다.
2. alert 대신 confirm을 써서 창에 확인 / 취소가 뜨게 하고 질문형에 맞는 어울리는 함수로 바꿨다

++

3. if 와 else 를 써서 만약 확인(true)를 누른다면 페이지 이동하게 하고

    취소(false)를 누르면 다시 되돌아가서 이동되지 않게 구현
 
 
 

---