reCAPTCHA Safari의 모달 대화 상자에서 AJAX API가 일관되게 작동하지 않습니다.

Question

AJAX API를 통해 reCAPTCHA를 사용하여 모달 대화 상자에 captcha를 표시하고 있습니다. jqModal을 사용하여 상자를 표시하고 PHP 버전이 이미 jqModal (알려진 버그 : http://markmail.org/message/bvip5vyb3czm7ngu)으로 인해 버그가 있으므로 reCAPTCHA의 AJAX 버전을 사용하고 있습니다.

이제 reCAPTCHA가 Firefox에서 잘 작동합니다. 그러나 Safari에서는 항상 표시되지는 않습니다. 때로는 정상적으로 작동하지만 시간의 약 20 %는 reCAPTCHA 상자가 표시되지 않습니다.

는

jqModal 선언은 다음과 같습니다

$().ready(function() { 
    $('#modalBox_register').jqm({ 
    ajax: '/modals/register.php', 
    trigger: 'a#registerButtonLink', 
    onShow: function(h) { 
    h.w.css('opacity', 1.00).fadeIn(300); 
    }, 
    onHide: function(h) { 
    h.w.fadeOut(300, function() { if (h.o) h.o.remove(); }); 
    } 
}); 
}); 

그리고 모달 상자 내에서 HTML/PHP는 다음과 같다 : 사람이 단서가 있습니까

<div id="registerModal"> 
<p class="caption">Registration form:</p> 
<form name="registerForm" id="modalRegisterForm" class="modalForm" action="/register/" method="post"> 

    <table cellspacing="15" border="0"> 
    <tr> 
    <td class="left"><label for="firstName">First Name:</label></td> 
    <td class="right"><input type="text" name="firstName" id="firstName" value="" class="registerModalTextField" /></td> 
    </tr> 
    <tr> 
    <td class="left"><label for="lastName">Last Name:</label></td> 
    <td class="right"><input type="text" name="lastName" id="lastName" value="" class="registerModalTextField" /></td> 
    </tr> 
    <tr> 
    <td class="left"><label for="email">Email Address:</label></td> 
    <td class="right"><input type="text" name="email" id="email" value="" class="registerModalTextField" /></td> 
    </tr> 
    <tr> 
    <td class="left"><label for="password">Password:</label></td> 
    <td class="right"><input type="password" name="password" id="password" value="" class="registerModalTextField" /></td> 
    </tr> 
    <tr> 
    <td class="left"><label for="passwordConfirm">Confirm Your Password:</label></td> 
    <td class="right"><input type="password" name="passwordConfirm" id="passwordConfirm" value="" class="registerModalTextField" /></td> 
    </tr> 

    <tr> 
    <td class="left">&nbsp;</td> 
    <td class="right"><div id="termswrap"> 
     <input id="terms" type="checkbox" name="terms" /> 
       <label id="lterms" for="terms">&nbsp;I have read and accept the <a href="/backmatter/termsofuse/">Terms of Use.</a><br /></label> 
       </div><!-- /#termswrap --></td> 
    </tr> 


    <!-- reCAPTCHA --> 
    <tr> 
    <td class="left"><label for="captcha">Are you human?</label></td> 
    <td class="right"><!-- Using the reCAPTCHA AJAX API, because the non-AJAX API is buggy with jqModal --> 
    <div id="recaptcha_div"></div> 
    <script type="text/javascript" 
     src="http://api.recaptcha.net/js/recaptcha_ajax.js"></script> <script 
     type="text/javascript"> 
      Recaptcha.create("123456789...", 
      "recaptcha_div", { 
      theme: "white" 
      }); 
     </script> 

    </td> 
    </tr> 


    <tr> 
    <td class="left">&nbsp;</td> 
    <td class="right"><input type="image" id="submitButton" src="/images/modals/button_register.png" value="Submit" alt="Submit" name="submit" /></td> 
    </tr> 
    </table> 


</form> 
</div><!--/#registerModal--> 

왜 reCAPTCHA를 AJAX 호출 ISN ' Safari에서 제대로 작동하지 않습니까?

Answer 1

Safari는 태그를 다시 렌더링 할 때 javascript를 다시 실행한다고 생각합니다. 대화 상자가 열리면 모달 대화 상자의 내용이 다시 렌더링됩니다. 게다가, 나는 re-render 된 후에, recaptcha에 의해 사용 된 document.write가 그것이 어디에 있고 뒤죽박죽인지 혼란 스러울 것이라고 생각한다.

이

$('#captcha-form script').remove();

'보안 문자 형태는'보안 문자를 포함하는 형태의 ID입니다 : 어떤 경우에, 여기 내 문제를 해결거야. 스크립트 태그를 제거하면 jQuery가 스크립트를 이동 한 후 Safari가 스크립트를 다시 렌더링 할 때 스크립트가 다시 실행되지 않습니다. 스크립트로 작성된 이벤트 핸들러는 스크립트 태그에 없으므로 생존합니다.