首页 > 解决方案 > 我们可以通过单击html和js中其他网页上的按钮在一个网页上显示图像吗?

问题描述

我创建了一个 js 文件,其中包含更改图像源的代码

function profilefill() {
//alert("Ok In...");
document.getElementById('profile').src = 'profileicon.png';
}

然后我创建了两个网页,一个包含一个按钮和一个对 js 文件的引用

<button id="signin" onclick="profilefill()" style="height: 40px; width: 90px; margin-top: 5px; 
background-color: black; color:white;">Sign in</button>
<script src="profilescript.js"></script>

在另一个我想更改图像的文件中,我获得了与以前相同的 js 文件的引用,但图像未显示。

标签: javascripthtml

解决方案


好的,要检查更改的图像,您必须转到其他页面。因此,在重定向时,您可以将数据发布到图像应该更改的下一页。然后在重定向到下一页后,如果图像应该更改,您可以请求发布数据。如果应该,则更改源,如果不应该,则显示默认图像。

您可以通过多种方式做到这一点,但如果我在那里,我会这样做。

<form method="post" id="theForm" action="REDIRECT_PAGE.php">

然后在该表单中放置一些隐藏字段。

<input type="hidden" name="sould_change" value="yes">
</form>

然后当按钮单击时。

Your_button.addEventListener("click", document.getElementById('theForm').submit());

然后在下一页。您可以使用 AJAX 或任何服务器端脚本(如 PHP)来读取数据并设置条件,例如,

if( $_POST['sould_change'] == "yes"){
    //change the image source
}else{
    //keep it default
}

推荐阅读