通过AJAX加载的页面上的reCAPTCHA字段无法加载。 建议？
实例：
- 没有AJAX
- 使用AJAX（单击“发送电子邮件”链接）
当我查看源页面时，一切正常，但是当我通过AJAX请求加载时，在reCAPTCHA所在的位置，我看到……
显然，除非我的用户已禁用JS，否则这不起作用。 在此过程中不会抛出任何错误。
以非AJAX请求的速度查看代码，我看到……
请注意脚本顶部的附加行，用于解决启用了JS的用户的问题。
所以我想问题是双重的。 WTF正在发生，我该如何解决？
我发现这个问题含糊其辞，但没有得到满满的答案。 我发现使用document.write提到了reCAPTCHA API，但我不知道它是否有效。 如果我忽略了一些明显的东西，请随时指出。
根据请求，AJAX调用是……
$(document).ready(function() { $.get('/inc/email.php', function(data){ console.log('Get success!'); $('#email-form').html(data); console.log('Get added to #email-form!'); $('#email-form form').submit( function(){ $.ajax({ type: "POST", url: "/inc/email.php", data: $('#email-form form').serialize(), success: function() { console.log('Submit success!'); $('#email-form').html(data); } }); return false; }); } ); });
到目前为止我尝试了什么：
- 重写代码以获取远程JS文件，将document.write（）子句替换为我设置为特定ID的元素的附加，然后在页面上内联运行修改后的代码
- 显示没有插件的reCAPTCHA而不是PHP reCAPTCHA库
说明：
使用AJAX进行此操作时中断的原因是因为jQuery在将其附加到DOM之前从HTML中删除任何script标记，并在全局上下文中对其进行评估 。 它不会与HTML的其余部分一起插入DOM。
在你的代码中：
您的代码中的罪魁祸首就是这一行：
$('#email-form').html(data);
您将从服务器获取原始HTML字符串，并将其附加到DOM。 但是，jQuery 首先从data变量中删除script标记 ，然后在全局上下文中对其进行评估。
由于recaptcha.js脚本使用document.write将其内容添加到DOM中，因此它会中断; document.write必须准确运行您希望它输出HTML的位置。
解决方案：
有两种可能的解决方案。
解决方案＃1：
您可以使用vanilla JavaScript自行插入script标记，而不是完全依赖jQuery，这将导致document.write在您想要的地方运行 – 就在DOM中：
success: function() { var form = $('#email-form')[0], script = $('')[0]; form.appendChild(script); }
注意这些行末尾的[0] 。 它们用于访问底层的本机DOM对象，因此我们可以使用DOM的本机appendChild 。
解决方案＃2：
不要通过AJAX加载数据，而是考虑将其放在自己的页面中，然后只需在页面中插入iframe ：
success: function() { $('#email-form').html(''); }
你可以回复/inc/email.php文件中的所有内容！ 您必须提前包含所有必要的文件。