function load_AnimalChosen(xxxx) {
alert("in AnimalChosen");
var s = document.getElementById("animal");
s.textContent = "ANIMAL" ;
{
/* Set height of body and the document to 100% */
body, html {
height: 100%;
margin: 0;
font-family: Arial;
overflow:hidden;
}
iframe {
height: 48%;
padding: 2px 2px;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<iframe id="iFrame_5" src="animals.svg" width="100%" ></iframe>
<p>the animal is a ...</p>
<p id="animal">????</p>
</body>
</html>
У меня есть веб-страница с двумя вкладками.
Первая вкладка содержит изображение SVG - кошка и собака.
Вторая вкладка пуста, но предназначена для загрузки информации в зависимости от того, какое животное выбрано в изображении SVG на вкладке 1.
Когда я нажимаю на кошку, эта функция в SVG активируется, чтобы указать веб-странице загрузить информацию о кошках в Tab2.
xxxx равно 1 для кота
function loadAnimal(xxxx){
var chosen_value = xxxx;
window.parent.load_AnimalChosen(chosen_value);
}
Функция load_AnimalChosen () на веб-странице не активируется.
Как должна быть написана строка 2?
Я уверен, что этот код работал в inte rnet explorer и firefox несколько лет go. Тогда он работал только в firefox, а не в Edge. Теперь это совсем не работает.
Мне не удалось загрузить svg во фрагмент кода. это подходящий файл.
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width = "100%" height = "100%" viewBox="0 0 540 328" >
<script>
<![CDATA[
function loadAnimal(xxxx){
var chosen_value = xxxx;
alert("chosen_value " + chosen_value);
window.parent.load_AnimalChosen(chosen_value);
}
]]>
</script>
<text x="175" y="52" font-size="28" fill="blue" font-style="italic" font- weight="bold" text-anchor="middle" onclick="loadAnimal(1)" >CAT</text>
<text x="175" y="152" font-size="28" fill="blue" font-style="italic" font-weight="bold" text-anchor="middle" onclick="loadAnimal(2)" >DOG</text>
</svg>