访问输入字段 Puppeteer答案

【问题标题】：Access to Input field Puppetier访问输入字段 Puppeteer
【发布时间】：2021-10-29 22:43:49
【问题描述】：

我有一个 puppeteer 刮刀，我必须插入信用卡信息。访问 Cvv 和 Expire 字段没有问题，但我无法输入 cc number 字段。

像这样在 iframe 内提交的输入

<iframe src="bla bla bla my url" scrolling="no" name="FrameCCPay" id="FrameCCPay" frameborder="0" allowtransparency="true" style="width: 100px; height: 18px; border: none; margin: 0px; padding: 0px; min-width: 100%; overflow: hidden;"></iframe>

在框架的文档中有这段代码

<div class="placePan">
   <div class="input-container">
      <input type="tel" autocomplete="off" spellcheck="false" name="482e7f7b-59aa-3f0d-bde7-8dcf6bcee7a7" class="cleavePan hasError" id="482e7f7b-59aa-3f0d-bde7-8dcf6bcee7a7" maxlength="24" placeholder="Numero Carta" style="display: inline-block;">
      <input type="tel" autocomplete="off" spellcheck="false" class="cleavePan" id="482e7f7b-59aa-3f0d-bde7-8dcf6bcee7a7_bin" maxlength="24" placeholder="Numero Carta" style="display: none;">
   </div>
</div>

我的 Puppetier 代码

const frame = getFrame(this.page, "FrameCCPay")
await frame.waitForSelector(".placePan input")
await frame.focus('.placePan input')
await frame.type(".placePan input", mynumber)

正如我所说，此代码适用于其他文件，并且文件 ae 以相同的方式完成。唯一的区别是 cc umber 有两个具有相同类的输入（.placePan 输入），所以我认为这就是问题所在。

我可以在正确的输入类型中使用 TYPE 函数吗？如何排除隐藏的 .placePan 输入？

【问题讨论】：

标签： javascript puppeteer

【解决方案1】：

如果您认为问题出在隐藏输入上，请使用具有仅在所需输入中存在的属性的选择器：".placePan input[name]"。

【讨论】：

我不能使用name或id，每次这个数据都不一样
@Stefano 你不需要属性值，只需要属性存在（答案中的选择器只需要属性存在）。
我试过但不幸的是它不起作用。在这一点上，我不明白问题是什么。我使用相同的系统来编译下一个带有 cvv 字段的 iframe，它对我来说可以正常工作。只有那部分会产生问题