web-dev-qa-db-ja.com

iframe内でボタンクリックをトリガーする

これはiframeコードです：

<div id="OutDiv" class="outerdiv">
    <iframe src="http://beta.sportsdirect.bg/checkout/onepage/" id="InnerIframe" class="FrameCSS" scrolling="no"></iframe>
</div>

上記のiframeが呼び出しているボタンのHTMlコードは次のとおりです。

<button type="button"  id="SuperWebF1" title="Continue" class="button">Continue</button>

以下は、ページがロードされたときにボタンのクリックをトリガーするために使用するjQuery関数です。

 $('#SuperWebF1').trigger( "click" );

しかし、これは、ボタンのソース内にjQueryコードを配置し、iframeがスクリプトでボタンを呼び出している場合にのみ、そのように機能します。

Iframeの外側からボタンをクリックするイベントを作成します。出来ますか ？

前もって感謝します！

javascriptjqueryhtmliframe
14
Venelin Vasilev

注：iframeのsrcがクロスドメインページを指している場合、.contents（）は機能しません。詳細： クロスドメインiframeの問題 および クロスドメインiframeのDOMコンテンツを取得

//execute code after DOM is ready
$(function() {

  //find iframe
  let iframe = $('#main_iframe');
  
  //find button inside iframe
  let button = iframe.contents().find('#main_button');
  
  //trigger button click
  button.trigger("click");
  
});
<!--Add jQuery library-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Iframe内で別のページを操作する必要がある場合は、公式のAPIまたはGETパラメーターを検索してください。例： Youtube Embed Video 、 Google Maps Embed Api

21
Amit Garg