javascript 如何检测用户已完成嵌入式表单?

9nvpjoqh  于 2023-02-02  发布在  Java
关注(0)|答案(3)|浏览(134)

我有一个Typeform嵌入到我的iframe页面中。从我的JS中,我想知道用户已经完成了typeform(即单击了Submit)。typeform JS似乎没有提供任何可以监听的事件。目前我只找到了以下解决方案--定期调用以下测试来检测outro页面是否正在显示:

document.getElementById('my-typeform-iframe').getElementsByClassName('outro').length > 0

有没有更好的办法?

r1wp621o

r1wp621o1#

好吧,那么我在上面的假设中是错误的-结果是typeform iframe在用户提交表单时发出一个事件。该事件被命名为form-submit,可以通过以下方式处理它:

window.addEventListener('message', function(event){
      if(event.data == 'form-submit')
        // your business logic here
    }, false);
kcrjzv8t

kcrjzv8t2#

Typeform现在有一个“onSubmit”回调特性。

<script src="https://embed.typeform.com/embed.js"></script>
<script>
  window.addEventListener("DOMContentLoaded", function() {
    var el = document.getElementById("my-embedded-typeform");
    window.typeformEmbed.makeWidget(el, "https://admin.typeform.com/to/cVa5IG", {
    onSubmit: function() {
      alert("submited!");
    }
  });
});

这是documentation
显然,没有简单的方法来检索答案。正如@matthew所提到的,一个response_id被传递给回调(我猜),你可以用它来查询API,但你需要实现一个重试循环,因为响应不是立即可用的。

gwbalxhn

gwbalxhn3#

感谢peter answer,我检查了他们提供的活动,得到的好结果很少。以下是我的发现:

window.addEventListener('message', function(event){
  if(event.data.type == 'form-submit')
    // your business logic here
}, false);

事件数据有以下几种类型:

  • 形式-主题
  • 不良资产救助计划
  • 格式就绪的
  • 形状高度变化
  • 格式屏幕已更改
  • 没有类型的JSON事件,具有表单应答
  • 包含表单提交信息的JSON事件
  • 表单提交
  • 嵌入式自动关闭弹出窗口

相关问题