jQueryの「.click()」の起こし方

Question

お世話になっております。

jQueryの「.click()」の起こし方について教えてください。

埋め込んだ動画の再生を別のボタン#playでさせる場合、下記では何がいけないのでしょうか？

<div class="media">
  <iframe src="https://player.vimeo.com/video/288559456?app_id=122963" title="(Otto)" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" width="660" height="370" frameborder="0"></iframe>
  <p id="play">クリックで再生</p>
</div>

<sctipr>
$('body').on('click', '#play', function() {
  setTimeout(function(){
       $('.vp-controls button').click(); //効かない!?
  },100);
});
</script>

それっぽいクラスを対象にいろいろ「.click()」を掛けてみたのですが反応してくれません。

上のサンプルも置いておきます。
https://jsfiddle.net/m5b3uta7/
お試し頂き、解決策にアテのある方がいらしたらご回答頂ければ幸いでございます。

Answer 1

jQueryの「.click()」の起こし方というより、vimeoの動画をJSで制御することが目的なら
vimeoが提供しているライブラリを使いましょう。

https://help.vimeo.com/hc/en-us/articles/224818467-Can-I-control-the-Vimeo-player-with-JavaScript-

Comments

[xenbeat]

試してないですが、普通にクリックイベントで上記ライブラリのplay()メソッドを読んであげればいけると思いますよ。

[eaconian]

お、これはどうもありがとうございます。できそうです。

Answer 2

残念ながら、クロスオリジン（別なドメイン）となるiframe内の操作を、JavaScriptで行うことはできません。

Comments

[eaconian]

そうでしたか…残念。ありがとうございます。
JavaScriptで行うことはできませんとのことですけれど、他に方法があるのでしょうか？

[maisumakun]

サイト内でできる方法はないですね（埋め込まれる側のサイトに仕掛けをできるなら別ですが）。

[eaconian]

埋め込まれる側の仕掛けに依存するのですか。ありがとうございます。覚えておきます。