JavaScript가 양식 제출을 방지하는 코드를 구현하는 방법 소개-JS 튜토리얼-php.cn

JavaScript가 양식 제출을 방지하는 코드를 구현하는 방법 소개

巴扎黑

풀어 주다： 2017-08-18 10:08:05

원래의

1804명이 탐색했습니다.

이 글에서는 폼 제출을 방지하기 위한 JavaScript 메소드를 주로 소개합니다. 폼 제출을 방지할 때 주의해야 할 사항과 onSubmit과 check()의 차이점을 코드 예제를 통해 설명합니다.

<body>
 <form action="clock.html" method="post" onsubmit="return checkLength()">
  <p>name:<input type="text" name="user" id="user"></p>
  <input type="submit" id="submit" name="submit"> 
 </form>
</body>
</html>

로그인 후 복사

html 페이지 .

첫 번째 방법: 이벤트의 기본 이벤트 차단 메커니즘을 사용하고 페이지가 로드된 후 제출 요소를 얻은 다음 제출을 위한 클릭 응답 기능을 등록하며 매개변수는 이벤트 이벤트입니다. 사용자가 응답 기능을 트리거하기 위해 제출을 클릭한 후 직접 event.preventDefault()가 양식 점프를 방지합니다.

두 번째 방법: onsubmit="return checkLength()" 속성 아래에 checkLength()" 속성을 추가하거나 양식 태그 아래에 id="submit"이 있는 입력 태그를 추가합니다. 함수에서 양식 제출 반환을 방지하는 함수 false;
함수 내 코드가 아래쪽으로 실행되는 것을 방지합니다. return;

이 함수를 호출하면 양식을 제출하는

1.form

submit이라는 두 가지 이벤트가 있습니다. 직접 제출하면 제출 버튼을 클릭할 때 양식

onSubmit이 먼저 트리거되고, 제어되지 않은 경우 기본적으로 true를 반환하므로 양식이 트리거됩니다. submit，提交表单，如果直接调用该函数，则直接提交表单
onSubmit，提交按钮点击时先触发，然后触发submit事件。如果不加控制的话，默认返回true，因此表单总能提交。

2. JS的校验

通过在JS中用document.myform.name.value

2. JS 검증.

JS에서 document.myform.name.value를 사용하여 각 사용자 입력을 받고 완전히 통과되면 이를 검증합니다.

3. 페이지 코드 구현

/*
<form name="testform" action="hello.html" method="post" onSubmit="return check();">
 <input type="text" name="name">
 <input type="submit" value="提交">
</form>
*/

로그인 후 복사

4.JS 구현

function check(){
 if (document.testform.name.value=="admin") {  
  alert("姓名不正确");  
  return false; 
  }
 else{
  return true;
  }
}

로그인 후 복사

🎜🎜에 주의하세요🎜 🎜🎜🎜 하지 마세요 onSubmit into: "check()" 이렇게 하면 확인에 실패하면 양식이 제출되지 않습니다.

위 내용은 JavaScript가 양식 제출을 방지하는 코드를 구현하는 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!