폼개발로 배우는 else if, and, or 문법

[Sugar]

안녕하세요. 질문드립니다.
폼개발로 배우는 else if, and, or 문법 강의 11:44초 부분 form에 submit되었을 때로 주셨는데
Submit버튼이 클릭 되었을 때 함수를 실행하는 방법으로는 왜 안되는건가요?

$('form).on('submit',function(){})이 아닌 $('submit버튼')on('click',function(){});로는 왜 실행이 안되는지 궁금합니다.
그리고 만약 안된다면 form요소로 감싸져있는 버튼을 동작하려면 반드시 form에 submit이벤트로 줘야 동작하는건가요?

[codingapple]

안되는 코드를 다 적어주셔야 정확한 판단이 가능한데

submit 버튼을 누르면 폼전송까지도 일어나서 페이지가 새로고침되어서 그런 것 같습니다 

submit 버튼을 누르면 폼전송을 막는 코드를 적으면 원하는대로 개발이 가능할듯합니다. 

[Sugar]

처음 질문한 부분은 제가 잠시 착각했었네요.

혹시 밑에 두 방법 모두 동일한 결과가 나오는데 그럼 아무 방법으로 해도 상관없나요?
첫 번째는 form요소에 submit이벤트가 발생할 때 함수를 실행한 코드이고
두 번째는 버튼을 클릭시 함수를 실행한 코드입니다.
 
// form요소에 'submit'이벤트
$('form').on('submit',function(){
  alert("form!");
  var user_text=$('#user_text').val();
  console.log(user_text);
})

// #user_btn(버튼)에 'click'이벤트
$('#user_btn').click(function(){
  alert("button!");
  var user_text=$('#user_text').val();
  console.log(user_text);
});

그리고 이미지 첨부 기능은 없나요? 캡쳐해서 한 번에 보여드리는게 좋을 꺼 같은데 이미지를 첨부할 수가 없네요 

[codingapple]

user_btn 버튼이 폼안에있는 type="submit" 버튼이라면

두 코드다 클릭하면 폼전송이 되는 코드입니다 폼전송시 뭔가 실행하고싶다면 둘다 써도 상관없을 듯 합니다. 

결국 둘다 전송되지만 두번째 코드는 버튼클릭 + 폼전송 이 두개의 이벤트가 차례로 일어나긴 하겠네요

이미지 첨부기능은 없습니당 

[Sugar]

감사합니다ㅎ

[글쓴이]

글