Onclick 在第三方表单 iframe 中填写表单字段

Posted 2023-05-09

【中文标题】Onclick 在第三方表单 iframe 中填写表单字段

【英文标题】：Onclick fill form fields in third party form iframe

【发布时间】：2020-04-16 02:39:48

【问题描述】：

自从过去两天以来，我一直在努力实现在 iframe 中自动填充第三方表单中的字段，就像这样

$("#btn1").click(function() 
  $("#test1").val("10");
  $("#test2").val("1.5");
  $("#test3").val("1000");
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Formula 1:
  <input type="text" id="test1" value="">
</p>
<p>Formula 2:
  <input type="text" id="test2" value="">
</p>
<p>Formula 3:
  <input type="text" id="test3" value="">
</p>
<p>What the answers to these formulas?</p>
<br>
<button id="btn1">Hint</button>

我经历了太多的tute，我什至忘记了我从哪里开始。

我已经通过this solution 但这不是我想要的。

这里有另一个类似的解决方案Fill input field inside an iframe when link outside of iframe is clicked

但用户正在使用她/他自己的 javascript 作为 jquery.postmessage.min.js

知道如何实现这一点吗？

【问题讨论】：

***.com/questions/19152646/… 我发现了这个问题。看看这个

@dizefurkan 已经在此解决方案链接中提到了这一点。

在 iframe 中，jquery 不起作用

【参考方案1】：

您可以使用类似这样的方式访问 iframe 的内部 html

document.querySelector('iframe').contentWindow.window.document.querySelector('Tag you wanna select')

您可能会遇到此错误blocked a frame of origin null from access a cross-origin frame。已解决此问题here。

虽然这可能只是选择了 iframe 中的选择元素，但我仍然不确定您是否真的可以在 iframe 中填写表单。

Edit- 刚刚试了一下，其实可以这样修改frame的innerHTML。希望这会有所帮助。