Доступ к элементам встроенного документа

Question

Доступ к элементам встроенного документа

0

Я хочу иметь доступ к классам из встроенного видео Vimeo. Мой iframe выглядит так:

HTML

<iframe id="vimeo" src="//player.vimeo.com/video/85509673?portrait=0&amp;badge=0&amp;color=a82a2a" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Я пытаюсь добавить событие click в класс play-button-cell например:

JQuery

var embeddedContent = $("#vimeo");
console.log(embeddedContent);
var doc = embeddedContent.contentDocument; // get the inner DOM
console.log(doc); 
console.log(doc.jQuery(".play-button-cell"));

doc.jQuery(".play-button-cell").click(function(){
    alert('ok!');
});

и я получаю следующее сообщение об ошибке в консоли:

Uncaught TypeError: Cannot call method 'jQuery' of undefined

play-button-cell существует, потому что я вижу это, когда я "проверяю элемент" на кнопке воспроизведения. Как я могу получить доступ к классу во встроенном контенте? Это возможно?

DEMO

Sionnach733 16 фев. 2014, в 17:37

Источник

Теги:

javascript

jquery

html

iframe

1 ответ

Ещё вопросы

DashK · Accepted Answer · 2014-02-16T13-40-00.000Z

Он не работает, если:

Ваша страница размещена на vimeo.com, или
vimeo.com позволяет вашему домену выполнять междоменное взаимодействие.

Это делается по соображениям безопасности. Думайте... посещая страницу, которую размещал человек. И человек, помещенный в IFRAME в свой блог, использует JavaScript, чтобы опубликовать статус Facebook на вашем поведении - Это плохо, не так ли?

Эта мера безопасности называется Same Origin Policy (Из соображений безопасности). Вы можете найти более подробную информацию здесь: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript

PS Если вы отлаживаете код, вы должны увидеть $ ('# vimeo'). ContentDocument возвращает NULL (или выбрасывает исключение зависит от используемого вами браузера).