我哥哥的成人礼即将在几个月后举行,我正在尝试制作一个设置为计时器的同步介绍动画。我的计划是让两个显示屏来显示不同的图像,让 DJ 有一个屏幕,他/她可以设置一个计时器,一个功能调用被发送到不同的页面。
目前我正在尝试做的是测试(实时)在“right.html”上单击的主体并更改“left.html”上的主体颜色
这是我的 javascript 代码:
function changecolor(){
document.getElementById('left').style.background = red;
}
左身体标签:
<body id="left">
正确的身体标签:
<body onclick="changecolor()" id="right">
我究竟做错了什么?
我已经使用本地存储对此进行了测试,以在同一浏览器中更改不同页面的颜色:
在需要在其他页面上设置更改颜色的页面上添加:
// Store background color
function changecolor(){
localStorage.setItem("background", "red");
}
在需要获取颜色的页面上:
// Loop every half a second, until the color is set
var intervalObj = setInterval(function(){
// Check for background value
var background = localStorage.getItem("background");
// If background is set, use it and unset it
if(background != "undefined" && background != null){
// Dev notify
console.log('Background setting to ' + background + '.');
// Stop unnecessary interval
clearInterval(intervalObj);
// Set the background color
document.getElementById('left').style.background = background;
// Unset the variable
localStorage.setItem("background", "undefined");
}else{
// Dev, notify if still didn't receive the color
console.log("Waiting for page to be clicked...");
}
}, 500);
注意:不同的页面使用不同的变量。相同的变量不会在超过一页上工作。您可以为不同的页面使用不同的变量,例如“background_page1”、“background_page2”等,让其他页面更改颜色。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句