把recaptcha响应放到一个knockout js可观察对象中

put recaptcha response into a knockout js observable

本文关键字：js knockout 一个 观察 对象 响应 recaptcha      更新时间：2023-09-26

我使用谷歌验证码，我要做的是把响应到一个可观察的，然后将其发送到后端服务器。我在努力，但我失败了。以下是代码。

<div class="form-group">
  <div class="col-sm-8">
     <div class="g-recaptcha"  data-sitekey="############"></div>
  </div>
</div>

下一段代码在js文件中带有knockout

self.recaptchaCode = ko.observable($('.g-recaptcha-response').val()); // Does not work

这是ajax发送到后端

$.ajax({
                type: 'POST',
                url: BASEURL + 'index.php/login/loginUsingAjax/' + auth,
                contentType: 'application/json; charset=utf-8',
                data: ko.toJSON({
                    email : self.eMail(),
                    password : self.passWord(),
                    recaptcha : self.recaptchaCode()
                })
            })

我想我没有得到正确的方式来获得响应到可观察的

这一行:

self.recaptchaCode = ko.observable($('.g-recaptcha-response').val());

用你的元素在创建可观察对象时的值设置该可观察对象。当你请求可观察对象的值(self.recaptchaCode())时，它是而不是重新求值;您收到一个缓存的响应。

这意味着只有在实例化视图模型时元素的值可用时，代码才能工作。Knockout不能神奇地监视非数据绑定的DOM元素。

我建议创建一个方法而不是一个可观察对象:

self.getRecaptchaCode = function() { 
  return $('.g-recaptcha-response').val();
};

最好是在元素上创建value绑定，但我不确定您是否可以访问DOM的.g部分…在这种情况下，您可以使用"真正的"淘汰方法:

<input data-bind="value: recaptchaCode">

与self.recaptchaCode = ko.observable()在您的视图模型

相关文章：