javascript - Stripe.js conflicting only when put into lightbox -
i using stripe.js add card customer. have done on standard page, @ it, there little information on page, i'd put in lightbox. have transferred relevant script inclusions had main site header lightbox header it's conflicting somewhere , can't work out why.
these script includes in original header:
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="/js/jquery.colorbox-min.js"></script> <script src="/js/admin_general.js"></script> <!--[if lt ie 9]> <script type="text/javascript" src="/js/tipped/excanvas.js"></script> <![endif]--> <script type="text/javascript" src="/js/tipped/spinners.js"></script> <script type="text/javascript" src="/js/tipped/tipped.js"></script> <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <script type="text/javascript" src="https://js.stripe.com/v2/"></script> <script type="text/javascript"> stripe.setpublishablekey("my_key_here"); </script>
...and script includes in new header:
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script> <!--[if lt ie 9]> <script type="text/javascript" src="/js/tipped/excanvas.js"></script> <![endif]--> <script type="text/javascript" src="/js/tipped/spinners.js"></script> <script type="text/javascript" src="/js/tipped/tipped.js"></script> <script type="text/javascript" src="https://js.stripe.com/v2/"></script> <script type="text/javascript"> stripe.setpublishablekey("my_key_here"); </script>
(obviously key in there)
this works fine when loaded directly browser window, when exact same page loaded colorbox gives me following error:
referenceerror: stripe not defined
i've tried delaying setting of key until document ready, in case trying set key before stripe.js loaded, nothing i've tried works... , since works fine directly in browser window has it's conflicitng something, what? happens in same way if remove traces , inclusions of tipped js script.
this frustrating, can shed light?
i worked out. needed include {iframe:true}
colorbox options ensure content acted on own without interference page being loaded from, hence conflict.
phew!
Comments
Post a Comment