В настоящее время я работаю над веб-приложением с разделенным экраном. Он использует селен для извлечения html веб-страницы, а затем отправляет и отображает его в iframes с использованием srcdoc. Я хочу, чтобы, когда кто-то нажимал ссылку на первом экране, чтобы на втором экране отображалась простая «загрузка», в то время как ajax-запрос отправляется на серверную часть для получения html-адреса URL (так как это может занять несколько секунд, чтобы загрузить), а затем отобразить полученный HTML на втором экране.
Для этого я «внедряю» код события JQuery в код src первого экрана во внутреннем интерфейсе (показан ниже) прямо перед тегом конечного тела (поскольку извлеченный источник является строкой, это легко сделать ). Второй экран имеет id = "oframe".
По какой-то причине событие JQuery не сработает. Есть идеи почему?
<script>
$("a").on("click",function(e){
e.preventDefault();
if(e.target.href){
let link = e.target.href;
parent.document.getElementById("oframe").srcdoc="<html><head></head><body>
<p>Loading</p></body></html>";
$.ajax({
url: "/newOrigin",
data: {"link":link},
type: "POST",
success: function(response) {
parent.document.getElementById("oframe").srcdoc=response.site;},
error: function(error) {console.log(error);}
});
}});
</script>
Обратите внимание, что событие работает, если у меня есть только
parent.document.getElementById("oframe").srcdoc="<html><head></head><body>
или
$.ajax({
url: "/newOrigin",
data: {"link":link},
type: "POST",
success: function(response) {
parent.document.getElementById("oframe").srcdoc=response.site;},
error: function(error) {console.log(error);}
});
внутри оператора if. Вместе они останавливают событие, я знаю, что, так как метод protectDefault () не работает (ссылка открывается в новой вкладке).
Пример <a> тег:
<a class="gdpr-modal-link" target="_blank" ref="http://www.politifact.com/privacy/">cookies</a>