1

jQuery와 함께 제출 한 내 웹 사이트 (http://www.jakelazaroff.com/#contact)에 양식이 있습니다. 양식이 성공적으로 제출되었을 때의 콜백 함수는 양식을 사라지게합니다. 그러나 어떤 이유로이 기능은 특정 브라우저/OS 조합에서만 작동합니다. 지금, 호환성 목록은 다음과 같다 : 이상한 목록이 (가 맥 OS 10.6.2에 파이어 폭스 3.5.5에서 작동하지만 파이어 폭스 3.5.5에서 맥 OS에 있습니다jQuery 양식 콜백 호환성 문제

WORKS 
o firefox 3.0, xp 
o firefox 3.0.14, vista 
o firefox 3.0.15, vista 
o firefox 3.5.5, os 10.6.2 
v chrome 4.0.249.30, os 10.6.2 
o chrome 3.0.195.33, w7 

DOESNT WORK 
o safari 4.0.4, os 10.6.2 
o safari 4.0.3, os 10.5.8 
o firefox 3.5.5, w7 
o firefox 3.5.5, os 10.5.8 
o chrome 3.0.195.33, vista 

o = unreproduced, v = reproduced, x = conflicting 

을 ... 10.5.8?).

// hide the form and display success message (called after form is submitted) 
function formHide() { 

    // cache form wrapper and blurb 
    var formWrapper = $("#contactForm"); 
    var formBlurb = $("#contact .formBlurb"); 

    // set the height of wrapper and blurb 
    formWrapper.height(formWrapper.height()); 
    formBlurb.height(formBlurb.height()); 

    // fade out required fields message, fade in success message 
    formBlurb.find(".requiredFields").fadeOut("fast", function() { 
    formBlurb.find(".thanks").fadeIn("fast"); 
    }); 

    // fade out form 
    formWrapper.find("form").fadeOut("slow", function(){ 
    // slide up the div so there's no jump 
    formWrapper.slideUp("slow"); 
    }); 
} 

// cache the form 
var form = $("#contactForm form"); 

// validate the form 
$("#contactForm form").validate({ 
    // when errors are made... 
    errorPlacement: function() { 
    // turn the background on those elements red 
    $("#contactForm form .error").animate({ backgroundColor:"#ff6666" }, "fast"); 
    }, 
    // when submitting the form... 
    submitHandler: function(form){ 
    $(form).ajaxSubmit({ 
    // use fm.pl as the submission script 
    url: "cgi-bin/fm.pl", 
    // hide the form if it's successful 
    success: formHide 
    }); 
    } 
}); 

내가 사용하는 양식 플러그인 http://malsup.com/jquery/form/에서 찾을 수 있습니다, 그리고 내가 사용하는 검증 플러그인 http://bassistance.de/jquery-plugins/jquery-plugin-validation/에서 찾을 수 있습니다 : 나는/검증 양식을 제출하기 위해 사용하는 코드 및 콜백 함수는 다음과 같다. 호환성을 깨뜨리는 뭔가가 빠졌습니까?

고마워요 :)

추신 죄송합니다. 링크로 사용중인 플러그인의 URL 형식을 지정하지 않았습니다. 평판 포인트가 10 개가 될 때까지 둘 이상의 링크를 게시 할 수 없습니다.
P.P.S. 좋아요, 게시하면 저에게 10 개의 더 많은 평판 포인트가 주어 졌으므로 지금 사용중인 플러그인의 URL이 링크가됩니다.

+0

+1도 10 점을 얻습니다 :) 이제 소식을 수정할 수 있습니다! – Rippo

답변

0

그게 효과가없는 것은 단지 퇴색일까요? 이 행은 의심스러운 것으로 보입니다.

formWrapper.height(formWrapper.height()); 
    formBlurb.height(formBlurb.height()); 

Whay 이미 높이를 설정하려고합니까?

+0

#contactForm의 높이를 명시 적으로 설정하면 양식이 희미 해지기 때문에 #contactForm에 내용이없고 붕괴되어 남아있는 내용이 공간을 채우기 위해 거칠게 튀어 오르기 때문입니다. 명시 적으로 높이를 설정하면 요소 안에 아무 것도없는 경우에도 요소의 높이가 유지됩니다. 페이지의 나머지 부분이 빈 공간을 채우기 위해 원활하게 위로 이동하도록 슬라이드 할 수 있습니다. – Jake

0

범인은 "success : formHide"에서 괄호를 생략 한 것 같습니다. 나는 그것이 괜찮다는 인상을 받았다. 그러나 분명히 그렇지 않다.