jQuery - 如何创建可撤销的操作?

时间:2011-04-03 15:56:00

标签: javascript jquery html action undo

所以我here有这样的代码,我用它来更新CSS,如果浏览器支持HTML5:

     $(":header").append('<style type="text/css">  body { background-color: rgb(200,200,200); margin: 0px; overflow: hidden; font: 100.01% "Trebuchet MS",Verdana,Arial,sans-serif; } #info { position: absolute; top: 0px; width: 100%; color: #ffffff;  font-family:Monospace;font-size:13px; font-weight: bold;          position:absolute;      height:100%;    overflow:auto; } a { color: #ffffff;} h1,h2,p{margin: 0 10px} h1{font-size: 250%;color: #FFF; text-shadow:0px 1px 1px #000;} h2{font-size: 200%;color: #f0f0f0;padding-top: 0.3em}div#nifty{ margin: 0 10%;background: rgba(250, 250, 250, 0.1); -moz-border-radius:15px; border-radius: 15px;} b.rtop, b.rbottom{display:block;background:#FFF; } b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA} b.r1{margin: 0 5px} b.r2{margin: 0 3px} b.r3{margin:0 2px} b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px} p, ul{color:#000;text-shadow: 0px 1px 1px rgba(255,255,255,0.6);padding-bottom:1em}input[type="button"], .eButton {width: 150px;padding: 5px 10px;word-wrap:break-word;height: auto;} b.rtop, b.rbottom{display:none;background: rgba(0,0,0,0)}html{ width:100%; height:100%; min-width:900; min-height:700;} body{ width:100%; height:100%; }  #container{ width:100%; height:100%;} </style>');

我在背景中有3d天空。

当一台EEE PC出现时(即使是最新的Chrome测试版),他也会登录我的Hi-ReS页面!统计数据&lt; = 4 fps。所以我需要制作一些UnDo的jQuery函数 - 清除添加到页面的内容。怎么做这个?

1 个答案:

答案 0 :(得分:5)

为什么不在身体上添加一个类,并使用该类使所有魔法发生?

示例:

(在你做的测试之后检查它是否支持html5)

$("body").addClass("html5Supported");

CSS(将其添加到CSS文件中):

.html5Supported {
    background-color: rgb(200,200,200);
    margin: 0px;
    overflow: hidden;
    font: 100.01% "Trebuchet MS", Verdana, Arial, sans-serif;
}

.html5Supported #info {
    position: absolute;
    top: 0px;
    width: 100%;
    color: #ffffff;
    font-family: Monospace;
    font-size: 13px;
    font-weight: bold;
    position: absolute;
    height: 100%;
    overflow: auto;
}

(对于你想改变的其他部分也一样)。

如果你想“撤消”它,只需删除它:

$("body").removeClass("html5Supported");

此方法IMO比查找附加的样式更好,而且与内联版本相比,您可以更好地控制CSS。