templates - 更新由 3rd 方库更改的淘汰赛模板中的元素

Question

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

2. 另一方面，我通过 3rd 方库更新了这个“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 的回调中设置可观察值（应该没问题）。

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

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