时间戳

首页 > 解决方案 > 如何在/从页面 B 调用和运行页面 A 的功能

javascript - 如何在/从页面 B 调用和运行页面 A 的功能

问题描述

是否可以在页面中调用和运行函数，比如说a.html从页面b.html

页面a.html如下所示，具有更新页面背景颜色的功能

<!DOCTYPE html>
<html>
<head>
<title>Page A</title>
</head>
<body>

<h1>This is Page A</h1>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" referrerpolicy="no-referrer"></script>
<script>
function UpdatePageA(){
   $("body").css("background-color","gold");
 }
</script>
</body>
</html>

页面b.html就像

<!DOCTYPE html>
<html>
<head>
<title>Page B</title>
</head>
<body>

<h1>Update Page A from Here</h1>
<button type="button" class="btn update-page-a">Update Page A</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" referrerpolicy="no-referrer"></script>
<script>

$(".update-page-a").on("click", function(){
   UpdatePageA();
});

</script>
</body>
</html>

标签： javascriptjquery

解决方案

此处的选项 4：https ://blog.bitsrc.io/4-ways-to-communicate-across-browser-tabs-in-realtime-e4f5f6cbedca

这是假设您打开了两个选项卡。如果您正在谈论从 a.html 到 b.html 的顺序移动，那么您可以使用查询字符串参数或本地存储。

推荐阅读