html打开方式解锁,使用jQuery锁定和解锁页面？

最简单的解决方法是：

$('#lock').click(function() {

$(this).siblings().andSelf().fadeOut();

$('#div_lock').fadeIn();

})

$('#unlock').click(function() {

$('#div_lock').fadeOut();

$(this).closest('div').siblings().fadeIn();

})​

(但请注意我用fadeIn()和​​而非“更多 - 突然'show()和hide())

JS Fiddle demo。如果任何人有权访问您的浏览器(假设这是某种安全功能)，他们仍然可以通过JavaScript控制台或通过刷新页面(假设没有登录)来覆盖此页面。

响应更新评论通过OP(下)左：

这是确定的，但如果我点击解锁，然后这让我也

hide

- 这应该我仍然display:none

您遇到的问题是，全部受影响的元素是style="display: none;"，一旦jQuery隐藏了它们(毕竟这就是它的工作方式);所以我建议一个整洁的做法，compartmentalising内容和控制，以类似下面：

Lock screen

Unlock screen

这本身借给以下的jQuery(存储节点隐藏/显示，因为它们是，然后根据需要恢复它们)：

var content = $('#content'),

contents;

$('#controls').children().slice(1).hide();

$('#lock').click(function() {

contents = content.html();

content.empty();

$(this).hide().siblings().show();

});

$('#unlock').click(function() {

content.html(contents);

$(this).closest('div').children().hide().first().show();

});​