进入表单后台点击「发布」→「更多发布方式」获取对应的嵌入代码,一共有「script 嵌入」、「iframe 嵌入」、「悬浮按钮」三种方式。
以 script 方式在 H5 网页嵌入表单
script 嵌入特点
直接将表单内容嵌入页面,与页面融合度高;
适合需要表单与网页样式统一的场景。
script 方式嵌入常见问题
-
字体重影问题
现象:提交按钮下方「提交即授权...」文字出现重影;
原因:字体颜色根据背景色自动计算,阴影用于凸显文字;
解决:修改前端 CSS 样式。
以 iframe 方式在 H5 网页嵌入表单
iframe 嵌入特点
通过框架方式嵌入,表单独立于主页面;
-
适合需要保持表单独立性的场景。
iframe 嵌入相关问题
-
提交按钮卡住
现象:点击提交后一直显示「提交中」;
解决:将代码中
inner_redirect=false
改为inner_redirect=true
。
-
手机端附件上传失败
现象:无法多次唤起相册/相机;
原因:QQ Browser 6.2 版本过旧(2015 年版本);
解决:更新内置浏览器内核至最新版本。
-
考试表单无法进入答题
现象:无法从「考前必读」页进入答题页;
原因:页面进行了 referer 校验;
解决:关闭「考前必读」或请求时添加 referer 。
以 悬浮按钮 方式在 H5 网页嵌入表单
悬浮按钮嵌入特点:
在网页中显示悬浮式按钮;
用户点击后在新页面打开表单;
不占用网页主体空间。
嵌入代码通用注意事项
1. 微信功能限制
⚠️ 开启「微信收集信息」或「微信支付」会导致所有嵌入方式失效;
解决方案:关闭相关功能或使用 H5 超链接。
2. 宽度调整
默认宽度:100% ;
修改方法:将代码中
width="100%"
改为所需百分比。
3. 第三方平台嵌入
❌ 不要使用普通表单链接;
✅ 推荐使用 script 或 iframe 嵌入代码;
避免提交后自动跳转或异常显示问题。
4. 跳转限制
非企业版基础版及以上版本,表单嵌入自有页面时,不能设置提交后跳转非金数据域名链接。