我有一个html页面foo.html和bar.html。
我希望foo.html上有一个按钮/链接,可以在bar.html上为div添加一个类。这是做什么的javascript或jQuery?
/foo.html
<a id="view1" onclick="addClass()" class="btn">View details »</a>
/bar.html
<div id="collapseThree" class="panel-collapse collapse"><div>
/foo.js
function addClass() {
???
}
修改
我可以使用任何东西,只要重定向到不同的页面设置div的类。
答案 0 :(得分:1)
Javascript位于单个页面中,不会直接影响其他页面上的任何内容。
相反,请将第一页上的链接更改为:
<a href="view1#foo" class="btn">View details »</a>
然后在接收页面上使用js来解析URL,防止默认操作,如果URL中存在锚,则添加一个类。
像这样的东西(我不做js / jquery,所以其他人可以为你改进):
var wHash = window.location.hash.split('#')[1];
if (wHash) {
$('#foo').addClass('whatever');
}
答案 1 :(得分:1)
是的,您可以使用cookies,localStorage或postMessage在页面之间进行通信,但无法直接访问其他页面的DOM。
试试这个:检查每个Xms是否localStorage已经改变(非常丑陋的解决方案,但没有服务器端脚本可以工作;)
foo.js(将其附加在两个文件中):
// apply to /foo.html
function addClass() {// toggleClass to be exact
// set localStorage['collapse'] to 1 or 0
localStorage['collapse'] = localStorage['collapse'] ? 0 : 1;
}
// apply to /bar.html
(function() {
var element = $('#collapseThree');
if(element.length) {
setInterval(function() {
// when localStorage['collapse'] is 1, add class .collapse
// other way: remove class collapse
element.toggleClass('collapse', !!(localStorage['collapse'] || 0));
}, 500);
}
})();
你可以更聪明地用window.onfocus替换setInterval,这取决于你的需求
答案 2 :(得分:0)
您可以使用socket.io执行此操作,让客户端A发出一个在其他客户端上调用addClass方法的事件。