2015-06-05 5 views
0

Я написал букмарклет (с небольшой помощью от экспертов в Stackexchange), и я столкнулся с небольшой проблемой, когда я не могу закрыть эту вещь.Создайте и закройте iframe в bookmarklet

Вот код (чувствительные люди, вероятно, следует двигаться дальше):

javascript: (function() { 



var htmlheader = "<html><head></head>" 

var html = htmlheader + "<body><a href='javascript:document.getElementById(\"TroubleiFrame\").style.visibility = \"hidden\"'>Close</a>" + 
       "</body></html>"; 

var iframe = document.createElement('iframe'); 
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html); 
iframe.style.background = "#fff"; 
iframe.style.width = "50%"; 
iframe.style.height = "500px"; 
iframe.style.left = "25%"; 
iframe.style.top = "25vh"; 
iframe.style.position = "fixed"; 
iframe.style.zIndex = "9999"; 
iframe.id = "TroubleiFrame"; 
iframe.style.boxShadow = "0 0 0 100vw rgba(0,0,0,0.75)"; 
document.body.appendChild(iframe); 

})(); 

При нажатии на тесной связи я получаю эту ошибку:

Uncaught TypeError: Cannot read property 'style' of null

Если я вставляю команду в Chromes утешать его работы:

document.getElementById("TroubleiFrame").style.visibility = "hidden"

У вас есть идеи о том, что я делаю неправильно? Если возможно, мне тоже понравилось бы краткое объяснение, чтобы я чему-то научился.

/Patrik

+0

Ваша близкая ссылка выполняется, прежде чем ur iframe присоединяется к телу. Выполните ваши первые 2 заявления после добавления iframe в тело. – AkshayJ

+0

Я не уверен, как это могло быть? Запуск букмарклета вызывает iFrame со ссылкой. Нажав на ссылку, вы получите ошибку, не генерируя фрейм? – PatrikJ

ответ

1

Ваш iFrame не знает об элементе под названием «TroubleiFrame», так как он находится в дочернем окне.

Вам нужно позвонить родителям вместо этого, и оттуда вы можете закрыть его

parent.document.getElementById("TroubleiFrame"); 

Посмотрите на this question, чтобы увидеть, как закрыть IFrame правильно. Прямо сейчас вы просто скроете его

+0

Да, еще один шаг! Но я не смог закрыть окно. Попадание этой ошибки: Uncaught SecurityError: заблокирован кадр с источником «null» от доступа к кадру с источником «https://www.sitename.com». Запрос доступа к кадрам имеет протокол «данных», к кадру, к которому осуществляется доступ, имеет протокол «https». Протоколы должны совпадать. – PatrikJ

+0

возможно, вы должны сначала создать iframe (около: пусто) и установить контент после его создания. –

-1

Я также столкнулся с этой проблемой, создав букмарклет, как и Pinterest's Pin It.

Он должен работать в кросс-домене.

Единственный способ, которым я мог бы решить эту проблему, был размещая события между страницы внутри фрейма и родительской страницы следуя этому примеру на GitHub:

https://gist.github.com/kn0ll/1020251

Я разместил ответ на это другой поток: https://stackoverflow.com/a/43030280/3958617

А также нашли еще один пример на этой другой теме: https://stackoverflow.com/a/21882581/3958617

Надеюсь, это поможет!