jquery 临时更改 div 高度/直到用户点击其他地方

Question

我有一个带有默认 css 高度的 #content div:auto。单击按钮并提交表单后，我将 content-div 的高度更改为 300:

if(msg == 'OK')
{
    result = '<div class="notification_ok">Thank you.</div>';    
    $("#content").height(300);
}

但它应该只在用户位于该特定页面时具有该高度，并且当他单击任何其他链接时，高度应再次设置为“自动”。我考虑过添加 css 类

.heightAuto { height: auto; }
.height300 { height: 300; }

然后说

$("#content").toggleClass(heightAuto height300);

但后来我认为我必须向每个链接添加一个 class="heightAuto"，因为我正在将我的链接动态加载到我的 content-div 中，以便不必每次都重新加载页面。有没有更好的方法使用 jquery 或临时设置 css 样式？

Answer 1

这个元素的目标受众是什么？如果是所有现代浏览器(IE9+)，你总是可以使用 CSS 伪选择器 :not():

http://www.w3schools.com/cssref/sel_not.asp

:not(.height300){
    height:auto;
}

那么您就不必在服务器脚本中显式设置 .heightAuto 类。