JS 를 이용 하여 양식 을 제출 하 는 몇 가지 방법 과 검증 (필수 편)

첫 번 째 방식: 폼 제출, form 탭 에 onsubmit 이 벤트 를 추가 하여 폼 제출 의 성공 여 부 를 판단 합 니 다.
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

 
            <code class="js string">"text/javascript"</code> 
            <code class="js plain">></code> 
           </div> 
           <div class="line number2 index1 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js keyword">function</code> 
            <code class="js plain">validate(obj) {</code> 
           </div> 
           <div class="line number3 index2 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(confirm(</code> 
            <code class="js string">"    ?"</code> 
            <code class="js plain">)) {</code> 
           </div> 
           <div class="line number4 index3 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js plain">alert(obj.value);</code> 
           </div> 
           <div class="line number5 index4 alt2"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">true</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number6 index5 alt1"> 
            <code class="js spaces">    </code> 
            <code class="js plain">} </code> 
            <code class="js keyword">else</code> 
            <code class="js plain">{</code> 
           </div> 
           <div class="line number7 index6 alt2"> 
            <code class="js spaces">      </code> 
            <code class="js plain">alert(obj.value);</code> 
           </div> 
           <div class="line number8 index7 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">false</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number9 index8 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number10 index9 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number11 index10 alt2"> 
            <code class="js spaces"> </code> 
            <code class="js plain">

 
            
                 
            "http://www.jb51.net"  onsubmit=  "return validate(document.getElementByIdx_x('myText'));"  >               
            "text"  id=  "myText"  />         
            "submit"  value=  "submit"  />            
              
            
             
              
               
두 번 째 방법: button 단 추 를 통 해 폼 제출 이 벤트 를 터치 합 니 다.οnclick = "submitForm ();" 은 다른 탭 의 속성 을 무시 합 니 다. 예 를 들 어 form 탭 의 onsubmit 속성 은 효력 을 잃 습 니 다.이 때 폼 검증 을 위해 인증 코드 를 submitForm () 에 놓 을 수 있 습 니 다.방법 에서 검증 하 다.
? 
1 
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12 
13 
14 
15 
16 
17 
18 
19 
20 
21 
22 
23  
            <code class="js string">"text/javascript"</code> 
            <code class="js plain">></code> 
           </div> 
           <div class="line number2 index1 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js keyword">function</code> 
            <code class="js plain">validate() {</code> 
           </div> 
           <div class="line number3 index2 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(confirm(</code> 
            <code class="js string">"    ?"</code> 
            <code class="js plain">)) {</code> 
           </div> 
           <div class="line number4 index3 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">true</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number5 index4 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">} </code> 
            <code class="js keyword">else</code> 
            <code class="js plain">{</code> 
           </div> 
           <div class="line number6 index5 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">false</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number7 index6 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number8 index7 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number9 index8 alt2"> 
            <code class="js spaces">   </code>  
           </div> 
           <div class="line number10 index9 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js keyword">function</code> 
            <code class="js plain">submitForm() {</code> 
           </div> 
           <div class="line number11 index10 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(validate()) {</code> 
           </div> 
           <div class="line number12 index11 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js plain">document.getElementByIdx_x(</code> 
            <code class="js string">"myForm"</code> 
            <code class="js plain">).submit();</code> 
           </div> 
           <div class="line number13 index12 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number14 index13 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number15 index14 alt2"> 
            <code class="js spaces"> </code> 
            <code class="js plain">      
              
            
                 
            "http://www.jb51.net"  id=  "myForm"  >              
            "text"  />         
            "button"  value=  "submitBtn"  onclick=  "submitForm();"  />             
              
            
             
              
               
세 번 째 방식: onsubmit 이 벤트 를 form 태그 가 아 닌 submit 태그 에 넣 습 니 다. 이 때 폼 검증 이 실 효 됩 니 다. 제출 단 추 를 누 르 면 폼 을 직접 제출 합 니 다.
? 
1 
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12 
13 
14 
15 
16 
17  
            <code class="js string">"text/javascript"</code> 
            <code class="js plain">></code> 
           </div> 
           <div class="line number2 index1 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js keyword">function</code> 
            <code class="js plain">validate() {</code> 
           </div> 
           <div class="line number3 index2 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(confirm(</code> 
            <code class="js string">"    ?"</code> 
            <code class="js plain">)) {</code> 
           </div> 
           <div class="line number4 index3 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">true</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number5 index4 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">} </code> 
            <code class="js keyword">else</code> 
            <code class="js plain">{</code> 
           </div> 
           <div class="line number6 index5 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">false</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number7 index6 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number8 index7 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number9 index8 alt2"> 
            <code class="js spaces"> </code> 
            <code class="js plain">      
              
            
                 
            "http://www.jb51.net"  >              
            "text"  />         
            "submit"  value=  "submit"  onsubmit=  "return validate()"  />            
              
            
             
              
               
네 번 째 방식: submit 단추 에 onclick 이 벤트 를 추가 합 니 다. 이 이 벤트 는 폼 제출 검증 에 사 용 됩 니 다. form 탭 에 onsubmit 이 벤트 를 추가 한 것 과 같은 기능 을 합 니 다.
? 
1 
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12 
13 
14 
15 
16 
17  
            <code class="js string">"text/javascript"</code> 
            <code class="js plain">></code> 
           </div> 
           <div class="line number2 index1 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js keyword">function</code> 
            <code class="js plain">validate() {</code> 
           </div> 
           <div class="line number3 index2 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(confirm(</code> 
            <code class="js string">"    ?"</code> 
            <code class="js plain">)) {</code> 
           </div> 
           <div class="line number4 index3 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">true</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number5 index4 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">} </code> 
            <code class="js keyword">else</code> 
            <code class="js plain">{</code> 
           </div> 
           <div class="line number6 index5 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">false</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number7 index6 alt2"> 
            <code class="js spaces">    </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number8 index7 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number9 index8 alt2"> 
            <code class="js spaces"> </code> 
            <code class="js plain">      
              
            
                 
            "http://www.jb51.net"  >              
            "text"  />         
            "submit"  value=  "submit"  onclick=  "return validate()"  />            
              
            
             
              
               
다섯 번 째 방식:
? 
1 
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12 
13 
14 
15 
16 
17 
18  
              
            
                 
            "http://www.jb51.net"  id=  "myForm"  >            
            "text"  />       
            "button"  value=  "submitBtn"  id=  "myBtn"  />            
              
            
                
              
            
                     
            <code class="js string">"text/javascript"</code> 
            <code class="js plain">></code> 
           </div> 
           <div class="line number11 index10 alt2"> 
            <code class="js spaces">  </code>  
           </div> 
           <div class="line number12 index11 alt1"> 
            <code class="js spaces">   </code> 
            <code class="js keyword">function</code> 
            <code class="js plain">validate() {</code> 
           </div> 
           <div class="line number13 index12 alt2"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(confirm(</code> 
            <code class="js string">"    ?"</code> 
            <code class="js plain">)) {</code> 
           </div> 
           <div class="line number14 index13 alt1"> 
            <code class="js spaces">        </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">true</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number15 index14 alt2"> 
            <code class="js spaces">      </code> 
            <code class="js plain">} </code> 
            <code class="js keyword">else</code> 
            <code class="js plain">{</code> 
           </div> 
           <div class="line number16 index15 alt1"> 
            <code class="js spaces">        </code> 
            <code class="js keyword">return</code> 
            <code class="js keyword">false</code> 
            <code class="js plain">;</code> 
           </div> 
           <div class="line number17 index16 alt2"> 
            <code class="js spaces">      </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number18 index17 alt1"> 
            <code class="js plain">}</code> 
           </div> 
          </div> </td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
    </div> 
   </div> 
   <p>  button           οnclick="submitForm();"，            ，  form    onsubmit      。          ，         submitForm();       </p> 
   <div class="jb51code"> 
    <div> 
     <div id="highlighter_170216" class="syntaxhighlighter js"> 
      <div class="toolbar">
        ? 
      </div> 
      <table border="0"> 
       <tbody> 
        <tr> 
         <td class="gutter"> 
          <div class="line number1 index0 alt2">
            1 
          </div> 
          <div class="line number2 index1 alt1">
            2 
          </div> 
          <div class="line number3 index2 alt2">
            3 
          </div> 
          <div class="line number4 index3 alt1">
            4 
          </div> 
          <div class="line number5 index4 alt2">
            5 
          </div> 
          <div class="line number6 index5 alt1">
            6 
          </div> 
          <div class="line number7 index6 alt2">
            7 
          </div> 
          <div class="line number8 index7 alt1">
            8 
          </div> </td> 
         <td class="code"> 
          <div> 
           <div class="line number1 index0 alt2"> 
            <code class="js keyword">function</code> 
            <code class="js plain">submitForm() {</code> 
           </div> 
           <div class="line number2 index1 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js keyword">if</code> 
            <code class="js plain">(validate()) {</code> 
           </div> 
           <div class="line number3 index2 alt2"> 
            <code class="js spaces">        </code> 
            <code class="js plain">document.getElementByIdx_x(</code> 
            <code class="js string">"myForm"</code> 
            <code class="js plain">).submit();</code> 
           </div> 
           <div class="line number4 index3 alt1"> 
            <code class="js spaces">      </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number5 index4 alt2"> 
            <code class="js spaces">   </code> 
            <code class="js plain">}</code> 
           </div> 
           <div class="line number6 index5 alt1"> 
            <code class="js spaces">  </code>  
           </div> 
           <div class="line number7 index6 alt2"> 
            <code class="js spaces">   </code> 
            <code class="js plain">document.getElementByIdx_x(</code> 
            <code class="js string">"myBtn"</code> 
            <code class="js plain">).onclick = submitForm;</code> 
           </div> 
           <div class="line number8 index7 alt1"> 
            <code class="js plain">     
이상 JS 를 이용 하여 양식 을 제출 하 는 몇 가지 방법 과 검증 (필수 편) 은 바로 편집장 이 여러분 에 게 공유 한 모든 내용 입 니 다. 참고 해 주시 기 바 랍 니 다.
다음으로 전송:https://www.cnblogs.com/tengqiuyu/p/7611765.html

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

다양한 언어의 JSON

JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

JS 를 이용 하여 양식 을 제출 하 는 몇 가지 방법 과 검증 (필수 편)

좋은 웹페이지 즐겨찾기