由第三方库更改的淘汰模板中的更新元素

Question

1. 我在敲除模板中有'div'元素（recaptchaDiv），它没有绑定到任何可观察字段：<div id="recaptchaDiv"></div>

2. 另一方面，我用第三方库更新了这个'div'。特别是，这是google recaptcha。这是我的代码：

   Recaptcha.create("[my private key]", "recaptchaDiv", { theme: "clean", callback: Recaptcha.ToTest });

它不起作用（我什么也看不见）。

我所知道的：

1. 试用FF控制台：$（“＃recaptchaDiv”）。html（） - 它显示了预期的html代码，我在浏览器中看不到它

我尝试了什么：

1. 将recaptchaDiv移到模板之外并且它可以工作：我可以在浏览器中看到验证码

2. 在html属性上绑定recaptchaDiv：

   在模板中：

   <div id="recaptchaDiv" data-bind="html: recaptcha"></div>

   在模型中：

   Recaptcha.create("[my private key]", "recaptchaDiv", { theme: "clean", callback: Recaptcha.ToTest }); recaptcha($("#recaptchaDiv").html());

它不起作用

（替换document.getElementById上的jquery没有帮助）

非常感谢任何帮助！

提前谢谢。

Answer 1

您是否确保您的观察者首先正常工作？尝试使用recaptcha（“foo”）之类的测试字符串来确保它呈现。

接下来，recaptcha是否可能是异步的？在这种情况下，您必须在recaptcha的回调中设置可观察值（应该没问题）。

编辑：根据文档，一旦创建了重新访问区域，就会触发回调，因此你必须在回调中获取它的HTML。试试这个：

Recaptcha.create("[my private key]", "recaptchaDiv", { theme: "clean", callback: function() {
  //the callback
  recaptcha($("#recaptchaDiv").html());
  Recaptcha.ToTest();
} });