Question

我在自己的网站上使用Smoothstate，最近在我的联系表单中包含了Recaptcha，这导致了一个奇怪的问题：通过表单中的脚本标签加载的Recaptcha脚本不会在通过Smoothstate进行的第一页加载中执行；不过，在后续加载中确实如此。如果我将脚本放在头部，它似乎可以正常工作，但我宁愿不要将脚本加载到每个页面上，而只能加载到联系表单页面上。我为为什么会发生而感到困惑-有人有想法吗？

这是我表格中的代码：

<script src="https://www.google.com/recaptcha/api.js?render=xxx"></script>
<script>
    grecaptcha.ready(function() {
        grecaptcha.execute('xxx', {action: ''}).then(function(token) {
           document.getElementById('g-recaptcha-response').value = token;
        });
    });
</script>

这是我的Smoothstate代码：

$(function() {
'use strict';
var options = {
        prefetch: true,
        cacheLength: 2, 
        onStart: {
            duration: 500, // Duration of our animation
            render: function($container) {
                // Add your CSS animation reversing class
                $container.addClass('is-exiting');

                // Restart your animation
                smoothState.restartCSSAnimations();
            }
        },
        onProgress: {
            // How long this animation takes
            duration: 0,
            // A function that dictates the animations that take place
            render: function ($container) {
                $('.loader-ring').show(100);
            }
        },
        onReady: {
            duration: 0,
            render: function($container, $newContent) {
                // Remove your CSS animation reversing class
                $container.removeClass('is-exiting');

                // Inject the new content
                $container.html($newContent);

            }
        },
        onAfter: function($container, $newContent) {
            addClass();
            fn();
        },
        blacklist: '.form, .image-link'
    },
    smoothState = $('#page').smoothState(options).data('smoothState');

}）;

Smoothstate-执行外部脚本时出现问题（Recaptcha）

0 个答案: