2010-01-24 9 views
5

양식에 클라이언트 측 JavaScript 유효성 검사가 있습니다. 그것은 위대한 작품. 하지만 JavaScript가 비활성화 된 사용자를 수용하고 싶습니다. 내 유효성 검사는 양식의 onsubmit 속성에서 실행되지 않으며 양식의 일반 버튼에 바인딩 된 이벤트 핸들러입니다. 제출 이벤트 제출/자바 스크립트가 비활성화 된 경우에만 제출 버튼을 누릅니다.

<input type="button" value="Ok" class="okbtn"> 

가 그럼 난 내 유효성 검사를 수행의 클릭 이벤트에 이벤트 핸들러를 등록 : 그래서 유효성 검사를 개막하고 제출 버튼을, 그냥 = "버튼"을 입력 있어요 제출 사실이 아니다. 모든 것이 성공하면 제출합니다 :

function clickHandler(event){ 
    thisForm = event.data.caller 
    var valid = submitValidation(thisForm); 
    if (valid == true){ 
     thisForm.submit(); 
    } else{ 
     } 
} 

내 문제는 사용자가 JS를 사용할 수없는 경우 양식을 제출할 방법이 없다는 것입니다. type="submit" 버튼을 JS 비활성 사용자에 대해 작동 할 수는 있지만, 항상 양식을 제출하고 JS 사용 가능 사용자에 대한 유효성 검사를 무시합니다. (유효성 검사는 실행되지만 어쨌든 제출할 것입니다). 버튼을 만들면 type="submit" 클릭하면 제출 이벤트를 차단할 수 있습니까? JQuery를 사용하고 있는데, JQuery가 제출을 억제 할 수 있습니까? 제출 여부를 처리하기 위해 유효성 검사를 원합니다.

답변

12

당신은 같은 것을 수행하여 클릭을 제출 억제 할 수

$('input[type=submit]').bind('click', function(e) { 
    e.preventDefault() // prevents the form from being submitted 
    clickHandler(); // the custom submit action 
}); 

또는, 실제 형태는 다음과 같이 제출 억제 할 수 있습니다 :

$('form').bind('submit', function(e) { 
    e.preventDefault(); 
    // etc 
}); 
+0

달콤한. 한 줄 변경 :) – Purrell

3

form 요소의 onsubmit 처리기를 설정하여 전송을 억제 한 다음 유효성 검사에 실패하면 false를 반환 할 수 있습니다.

thisForm.submit()을 호출하는 대신 유효성 검사가 성공하면 true를 반환하고 실패하면 false를 반환합니다.

3

변경 정상에있는 버튼은 버튼을 바인드 제출 양식의 submit() 이벤트에 대한 유효성 검사 워드 프로세서

$("form").submit(function() { 
    if (!submitValidation()) { 
    return false; 
    } 
}); 

: 사용자가 양식을 제출 를 시도 할 때

submit 이벤트는 요소로 전송됩니다. 요소에 만 첨부 할 수 있습니다. 양식은 명시 적 <input type="submit">, <input type="image"> 또는 <button type="submit">을 클릭하거나 특정 양식 요소에 포커스가있을 때 Enter 을 클릭하여 제출할 수 있습니다.

관련 문제