仅使用 HTML 从 URL 获取参数 [对于 Typeform 嵌入]

2024-01-03

一个简单的问题。

<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <title>Re-Imagining Business Models</title> <style type="text/css"> html{ margin: 0; height: 100%; overflow: hidden; } iframe{ position: absolute; left:0; right:0; bottom:0; top:0; border:0; } </style> </head> <body> <iframe id="typeform-full" width="100%" height="100%" frameborder="0" src="https://f03.typeform.com/to/AAAAAA?cl=xxxxx"></iframe> <script type="text/javascript" src="https://embed.typeform.com/embed.js"></script> </body> </html>

如果你能看到cl=xxxxx,我需要根据网站输入的参数更改xxxxx。

来自示例:

www.mywebsite.com/formpage?cl=123121

iframe 将运行该网站:https://f03.typeform.com/to/AAAAAA?cl=123121 https://f03.typeform.com/to/AAAAAA?cl=123121

是否可以仅使用 HTML?因为我正在使用 Wordpress,除了构建器和编辑 HTML 之外,我不知道能在其中做什么。

Thanks


这可以使用Typeform 嵌入 API https://developer.typeform.com/embed

你可以看到一个工作示例 https://tf-embed-with-params.glitch.me?utm_source=stackoverflow_question我在 Glitch 上制作的

您可以编辑here https://glitch.com/edit/#!/tf-embed-with-params.

重现步骤:

  1. 在 HTML 中包含 Typeform Embed SDK
  2. 从 URL 中提取参数

    let params = new URLSearchParams(location.search);

  3. 重建您的表单 URL

    var url = "https://YOUR_SUBDOMAIN.typeform.com/to/YOUR_TYPEFORM_ID"; url += "?utm_source=" + params.get('utm_source');

  4. 在目标中显示表单div

    const embedElement = document.querySelector('.target-dom-node'); window.typeformEmbed.makeWidget( embedElement, url, { hideHeaders: true, hideFooter: true, } );

希望能帮助到你 :)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

仅使用 HTML 从 URL 获取参数 [对于 Typeform 嵌入] 的相关文章

随机推荐