आईई में नए Google reCAPTCHA के साथ समस्याएं जब मॉडल या संवाद

रीकैप्चा क्रोम में पूरी तरह से अच्छी तरह से काम करती है।आईई में नए Google reCAPTCHA के साथ समस्याएं जब मॉडल या संवाद

हालांकि, (केवल जब reCAPTCHA iframe एक संवाद बॉक्स या मोडल के अंदर है) IE में प्लेसहोल्डर दूर नहीं जायेगा।

जो भी उपयोगकर्ता लिखता है उसे प्लेसहोल्डर (मुझे लगता है) का हिस्सा माना जाता है और "सत्यापित करें" बटन क्लिक करने के लिए सक्षम नहीं किया जाएगा।

एक ही कोड सभी ब्राउज़रों में पूरी तरह से अच्छी तरह से काम करता है जब मैं मोडल

<html lang="en"> 
<head> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"> 
    <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script> 
    <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
    <script type="text/javascript"> 
    var onloadCallback = function() { 
     grecaptcha.render('html_element', { 
      'sitekey' : '6Lc7PAATAAAAAE7JwcA7tNEDIrczjCCUvi3GiK4L' 
     }); 
    }; 
    </script> 
</head> 
<body> 
    <div class="container"> 
     <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
      Launch modal 
     </button> 
     <!-- Modal --> 
     <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
      <div class="modal-dialog"> 
      <div class="modal-content"> 
       <form action="?" method="POST"> 
        <div id="html_element"></div> 
        <br> 
        <input type="submit" value="Submit"> 
       </form> 
      </div> 
     </div> 
    </div> 
</div> 
</body> 
</html>

स्रोत

2015-01-11 Mutaz Ghuni

पुरानी recaptcha बाहर recaptcha div ले, यानी संस्करण 1.0 काम करता है:

चित्र यह बताता है ठीक है मोडल

स्रोत

2015-02-23 11:50:38

समस्या बूटस्ट्रैप के मोडल घटक द्वारा उत्पन्न होती है।

जब मोडल इस समारोह प्रकट करने के लिए के बारे में है कहा जाता है:

Modal.prototype.enforceFocus = function() { 
    $(document) 
    .off('focusin.bs.modal') // guard against infinite focus loop 
    .on('focusin.bs.modal', $.proxy(function (e) { 
     if (this.$element[0] !== e.target && !this.$element.has(e.target).length) { 
      this.$element.trigger('focus') 
     } 
    }, this)) 
}

समारोह सुनिश्चित करें कि फोकस मॉडल के अंदर अभी भी है होना करने के लिए दस्तावेज़ के लिए एक "Focusin" घटना कहते हैं, यदि फोकस मोडल के बाहर किसी अन्य तत्व पर जाता है तो उत्तरार्द्ध तुरंत इसे वापस प्राप्त करता है।
इसलिए, जब आप रिकैप्चा फॉर्म के अंदर क्लिक करते हैं तो फोकस 'संघर्ष इंटरनेट एक्सप्लोरर बग का कारण बनता है।

वैसे भी, एक संभावित समाधान उस विधि को ओवरराइड करना है और फोकस-बैक व्यवहार को अक्षम करना है जब एक रिकैप्चा घटक फोकस प्राप्त करता है, लेकिन यह करना मुश्किल है क्योंकि रिकैप्चा एचटीएमएल पर कोई नियंत्रण नहीं है (आप कैसे जान सकते हैं अगर e.target रिकैप्चा का एक तत्व है?)।

मेरे समाधान पूरी तरह से इस व्यवहार को निष्क्रिय करने, यह सिर्फ एक खाली समारोह के साथ enforceFocus समारोह को ओवरराइड करने के लिए है:

$.fn.modal.Constructor.prototype.enforceFocus = function() { };

एक और अधिक सुरुचिपूर्ण समाधान apreciated होगा। :)

स्रोत

2015-03-10 13:55:33 Digibusiness

जाहिरा तौर पर इस enforceFocus विधि "केवल" पहुँच उद्देश्य https://github.com/twbs/bootstrap/issues/4781 भी इस समारोह के लिए है IE के लिए conditionnaly अक्षम किया जा सकता है: यदि (/MSIE|Trident/.test(window.navigator.userAgent)) – fadomire

मैं इस कोड को कोणीय का उपयोग करके कहां रखूं? –

'अगला' और/या 'सत्यापित करें' बटन अभी भी काम नहीं कर रहा है। यह डीबगर में ब्रेकपॉइंट हिट करता है लेकिन दृष्टि से, कुछ भी नहीं बदलता है। –

'Digibusiness' द्वारा प्रतिक्रिया पर अनुवर्ती करने के लिए, एक और अधिक सुरुचिपूर्ण पूरे बूटस्ट्रैप फ़ंक्शन को एक व्यावहारिक के साथ ओवरराइड करना होगा (आपके पृष्ठ लोड पर - document.ready फ़ंक्शन एक अच्छी जगह होगी) । इस तरह, आप केवल आईई को संदर्भित कर सकते हैं जब मॉड्यूल पर लोड किए गए आईफ्रेम को ओवरर्डिंग करते हैं, इसलिए साइट पर पूरी तरह से एक विशिष्ट आईफ्रेम-ओवर-मोडल-ऑन के लिए एक्सेसिबिलिटी (जो इन दिनों एक बड़ा सौदा बन गया है) खराब नहीं कर रहा है -ए-विशिष्ट-ब्राउज़र कार्यक्षमता फिक्स।

कोड चला जाता है इस प्रकार है:

if (window.navigator.userAgent.indexOf("MSIE ") > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) { // If Internet Explorer 
    $.fn.modal.Constructor.prototype.enforceFocus = function() { 
     $(document) 
     .off('focusin.bs.modal') // guard against infinite focus loop 
     .on('focusin.bs.modal', $.proxy(function (e) { 
      if (this.$element[0] !== e.target && !this.$element.has(e.target).length) { 
       if (e.target.nodeName !== "IFRAME") { 
        this.$element.trigger('focus') 
       } 
      } 
     }, this)) 
    } 
}

स्रोत

2016-11-23 11:00:08 NaorS

आईई में नए Google reCAPTCHA के साथ समस्याएं जब मॉडल या संवाद

उत्तर

संबंधित मुद्दे