Question

我不得不使用一系列包含PayPal“立即购买”按钮的iframe。

出于美观原因，我想使用不同的PayPal按钮设计。因此，我使用CSS绝对定位将我的新设计放在iframes的“立即购买”链接上。使用jQuery我想点击这个新图像来触发PayPal iframe按钮。

页面上有多个PayPal按钮，所以我只想在点击图像时触发最近的iframe。

我的jQuery代码事件正在运行（单击时我可以看到控制台日志输出），但是，它没有按计划触发iframes按钮。

/*PayPal Buy Now Button Activation*/
$('.paypal-paynow img').click(function(event) {
  console.log('iFrame doohicky');
  $(event.target).closest("iframe").click();
});

<div class="paypal-paynow btn1">
  <img src="https://foo.com/new-paypal-image" alt="Pay Now Button">
  <iframe scrolling="no" src="https://foo.com/dev/product/iframepage1/"></iframe>
</div>

<div class="paypal-paynow btn2">
  <img src="https://foo.com/new-paypal-image.png" alt="Pay Now Button">
  <iframe scrolling="no" src="https://foo.com/dev/product/iframepage2/"></iframe>
</div>

Answer 1

iframe - 不是按钮，它是另一个DOM结构，无法点击。 iframe中的按钮只能通过$（）首先选中只有当iframe托管在与主页相同的域上时才能获得对它的访问 - 在另一种情况下它是XSS攻击 - 浏览器策略必须阻止它。你可以过去想要点击的元素id作为img标签的属性并模拟点击这样：

$('#Iframe').contents().find('#button id').click();

点击图片，模拟点击最近的iframe

1 个答案: