在函数内将值从父窗口传递到子窗口 - pass a value from parent to child window and within a function

pass a value from parent to child window and within a function

本文关键字：窗口函数 | 更新日期: 2023-09-27

我有一个包含多个图像的表单。一旦用户单击任何图像，就会出现带有缩略图的弹出窗口。单击任何缩略图后，需要根据用户选择替换父窗口中的源图像（交换原始图像）。以下脚本仅适用于一个图像，因为徽标 1 和 placeHolder1 变量是硬编码的。如何将图像 ID 从父窗口发送到弹出窗口，以便以下内容是动态的？

编辑

页面.编辑表单。徽标1.值 = o名称

编辑页面。placeHolder1.src = " images/user/" + oName;

顺便说一句，主窗口中的图像名称和 id 将根据表单模板进行更改。

模板.php

<script type="text/javascript">
function logoWin() {
window.open('logos.php','logos','height=500,width=700,status=yes,toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=yes');
}
</script>
<form action="" id="editForm" name="editForm" enctype="multipart/form-data">
<img src=”images/user/logo1.jpg” name="placeHolder1" id="placeHolder1" onclick='logoWin()'>
<img src=”images/user/logo2.jpg” name="placeHolder2" id="placeHolder2" onclick='logoWin()'>
<img src=”images/user/logo3.jpg” name="placeHolder3" id="placeHolder3" onclick='logoWin()'>
<input type="hidden" name="logo1" value="<?php echo $main_logo1; ?>" />
<input type="hidden" name="logo2" value="<?php echo $main_logo2; ?>" />
<input type="hidden" name="logo3" value="<?php echo $main_logo3; ?>" />
<input type="submit" value="Save" id="save">
</form>

徽标.php

<script language="JavaScript">
    function getFile(oImg){
        editPage = eval(window.opener.document)
        oSrc = oImg.src;
        lastSlash = oSrc.lastIndexOf('/');
        oName = oSrc.substr(lastSlash+1);
        editPage.editForm.logo1.value = oName
        editPage. placeHolder1.src = " images/user/" + oName;
        this.close()
    }
    </script>   
[php loop]
<img src='images/user/".$row->img_file_name."' onclick='getFile(this)'>
<img src='images/user/".$row->img_file_name."' onclick='getFile(this)'>
<img src='images/user/".$row->img_file_name."' onclick='getFile(this)'>

为什么使用

eval(window.opener.document);

您可以使用

var editPage = window.opener.document;

您可以使用页面的url传递 id，如下所示

function logoWin(id) {
    window.open('logos.php?id='+id,'logos','height=500,...');
}

将id作为函数参数传递，如下所示（logoWin(1)，logoWin(2)

<img src=”images/user/logo1.jpg” name="placeHolder1" id="placeHolder1" onclick='logoWin(1)'>
<img src=”images/user/logo2.jpg” name="placeHolder2" id="placeHolder2" onclick='logoWin(2)'>

在logos.php文件中，使用

$id = $_GET['id']; // it could be 1 or 2 or 3 and so on

然后，您可以将其用作JavaScript变量，例如

function getFile(oImg){
    var id = <?php echo $id; ?>;
    editPage = eval(window.opener.document);
    oSrc = oImg.src;
    lastSlash = oSrc.lastIndexOf('/');
    oName = oSrc.substr(lastSlash+1);
    var logo = 'logo'+id, placeHolder = 'placeHolder'+id;
    editPage.editForm[logo].value = oName;
    editPage[placeHolder].src = " images/user/" + oName;
    this.close();
}