子視窗呼叫父視窗函數

opener 父視窗 js opener

tsaipowun 2020-01-24 15:05:48 ‧ 2488 瀏覽

請問，子視窗呼叫父視窗的函數，函數名稱是否可以是變數。
也就是呼叫哪個函數，由父視窗開啟子視窗時才會確定
只知道子視窗要呼叫父視窗是 opener.xxxx();
xxxx是否可以是變數呢?

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

dragonH

iT邦超人 5 級 ‧ 2020-01-24 15:46:00

子視窗呼叫父視窗的函數，函數名稱是否可以是變數

可以

以下為範例

a.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>A</title>
</head>
<body>
    <button id = "btnOpen">Open</button>
</body>
<script>
    window.myName = 'dragonH';
    window.myFunc1 = () => {
        alert('hello ithelp');
    }
    const btnOpen = document.querySelector('#btnOpen');
    btnOpen.addEventListener('click', () => {
        window.open('./b.html', 'B');
    });
</script>
</html>

b.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>B</title>
</head>
<body>
    
</body>
<script>
    opener.myFunc1();
    console.log(opener.myName)
</script>
</html>

要注意的是

opener.myFunc1()

會在 parent window 執行

選我正解

回應 8
分享
檢舉

看更多先前的回應...收起先前的回應...

阿展展展 iT邦好手 1 級 ‧ 2020-01-24 15:51:41 檢舉

dragonH iT邦超人 5 級 ‧ 2020-01-24 15:55:12 檢舉

tsaipowun iT邦新手 5 級 ‧ 2020-01-24 22:40:57 檢舉

感謝回覆，myFunc1 這個名稱可以是父視窗提供的名稱嗎，是不固定的。
(期望是父視窗呼叫子視窗，運作完後執行父視窗要求的父函數。所以函數名不固定。)

dragonH iT邦超人 5 級 ‧ 2020-01-24 22:52:33 檢舉

tsaipowun

範例都貼在上面了唷

a.html 是 parent

b.html 是 child

tsaipowun iT邦新手 5 級 ‧ 2020-01-25 09:55:49 檢舉

dragonH
感謝回覆，需求可能沒說很清楚，我用比較完整的程式碼描述好了

a.php

window.open("b.php?function_name=myfun1");

b.php

<?PHP
 .....
 echo "<input type='hidden' id='fun_name' value='$function_name'>";
?>

<script>

 fun_name=document.getElementById('fun_name').value;
 //fun_name='myfun1'
 //想要執行父程式的 myfun1();
 //若使用opener.myfun1(),則是固定的函數名稱myfun1

</script>

也就是呼叫子視窗時，會提供一個函數名稱。(子視窗呼叫不固定的函數)。

tsaipowun iT邦新手 5 級 ‧ 2020-01-25 10:55:44 檢舉

剛剛想到用PHP 把 opener.xxx() 這段語法刻出來，應該就可以達到目的。
想說有沒有其他的方式.

dragonH iT邦超人 5 級 ‧ 2020-01-25 14:38:54 檢舉

tsaipowun

怎麼突然變 php 了

我不太知道你的目的

不過看看這是不是你要的

a.php

<button id = "btnOpen">Open</button>
<script>
    const btnOpen = document.querySelector('#btnOpen');
    btnOpen.addEventListener('click', () => {
        window.open('./b.php?func_name=func1');
    });
</script>

b.php

<?php
    $func_name = $_GET['func_name'];
    echo "<input type = 'hidden' id = 'funcName' value = '$func_name'/>";
?>
<script>
    const funcName = document.querySelector('#funcName').value;
    console.log(funcName)
</script>