Не удается получить доступ к элементу холста в iframe - PullRequest
0 голосов
/ 03 апреля 2012

Я получил iframe и хочу выбрать элемент canvas в этом iframe. Но это не работает. Я использую следующий код.

Это мой iframe

<body>
  <div id="canvasdiv" width="300" height="300"></div>
</body>

Это моя родительская страница

<iframe name="iframe" id="iframe" frameborder="0" width="325" height="325" src="..."></iframe>

С помощью JavaScript я добавляю холст с некоторыми свойствами. Например, идентификатор.

canvas.node.id = "canvas";

На моей родительской странице я получил следующий javascript.

var iframe = document.getElementById("iframe");
alert(iframe);
var iframe_canvas = iframe.contentDocument || iframe.contentWindow.document;
alert(iframe_canvas);
var canvas = iframe_canvas.getElementById("canvas");
alert(canvas);

Результат:

iframe = iframe element
iframe_canvas = html element
canvas = null

Кто-нибудь знает, почему я не могу получить доступ к элементу canvas? = (* 1 018 *

Ответы [ 4 ]

2 голосов
/ 04 апреля 2012

Извините, но я решил проблему.Спасибо за все отклики.=)

Чтобы проверить функцию getElementById, я вызвал ее как $(document).ready.Но в то время iframe не отображался браузером.Вот почему я мог получить доступ к iframe сам, но не к элементам iframe.Теперь я назначил функцию кнопке, и она работает.

1 голос
/ 03 апреля 2012

Согласно вашему HTML, эта строка кода:

var canvas = iframe_canvas.getElementById("canvas");

должно быть таким, чтобы указать правильное значение идентификатора в вашем div:

var canvas = iframe_canvas.getElementById("canvasdiv");
0 голосов
/ 01 апреля 2014

Ваш код вполне подходит для одной части. замещать getElementById("canvas") с getElementById("canvasdiv");

0 голосов
/ 03 апреля 2012

Вы пропускаете код, который добавляет сам элемент <canvas>.Вы уверены, что id равно canvas?

Если да, то вы можете столкнуться с проблемами политики того же происхождения в отношении доступа к содержимому iframes.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...