Question

尝试创建一些网站选项，用户可以选择自己的字体大小，我希望在不同的页面上保持整个网站的字体大小等。字体更换工作正常，但我遇到了麻烦（1时间使用它们！）

$(document).ready(function() {

var Cookie = "Font Size";
var fontsize = normal;

if($.cookie(Cookie)) {
    fontsize = $.cookie(Cookie);
    if (fontsize == "normal") {
        $("#main p, #side p, #box p, .header li").css({"font-size": "12px"});
    }
    else if (fontsize == "larger") {
        $("#main p, #side p, #box p, .header li").css({"font-size": "14px"});
    }
    else {
        $("#main p, #side p, #box p, .header li").css({"font-size": "16px"});
    }
} 
else {
    $.cookie(Cookie, fontsize);
}
} 

function normalFont() {
$("#main p, #side p, #box p, .header li").css({"font-size": "12px"});
fontsize = normal;
$.cookie(Cookie, fontsize);
}

 function largerFont() {
$("#main p, #side p, #box p, .header li").css({"font-size": "14px"});
fontsize = larger;
$.cookie(Cookie, fontsize);
 }
 function biggestFont() {
$("#main p, #side p, #box p, .header li").css({"font-size": "16px"});
fontsize = biggest;
$.cookie(Cookie, fontsize);
 }

HTML：我正在使用带onclick =“normalFont（）等

的按钮

还下载了Jquery cookie插件并将其链接到

感谢任何帮助，谢谢！

Answer 1

有多种语法错误

//this should be in global scope
var Cookie = "Font Size";
$(document).ready(function () {

    //string literal
    //also read the cookie value, if it is not present use the default value as `normal`
    var fontsize = $.cookie(Cookie) || 'normal';

    if (fontsize == "normal") {
        $("#main p, #side p, #box p, .header li").css({
            "font-size": "12px"
        });
    } else if (fontsize == "larger") {
        $("#main p, #side p, #box p, .header li").css({
            "font-size": "14px"
        });
    } else {
        $("#main p, #side p, #box p, .header li").css({
            "font-size": "16px"
        });
    }
}); //missing ) here

function normalFont() {
    $("#main p, #side p, #box p, .header li").css({
        "font-size": "12px"
    });
    //string literal
    fontsize = 'normal';
    $.cookie(Cookie, fontsize);
}

function largerFont() {
    $("#main p, #side p, #box p, .header li").css({
        "font-size": "14px"
    });
    //string literal
    fontsize = 'larger';
    $.cookie(Cookie, fontsize);
}

function biggestFont() {
    $("#main p, #side p, #box p, .header li").css({
        "font-size": "16px"
    });
    //string literal
    fontsize = 'biggest';
    $.cookie(Cookie, fontsize);
}

演示：Fiddle

Answer 2

添加引号

var fontsize = "normal";

和

fontsize = "larger";

和

fontsize = "biggest";

字体使用cookie调整大小

2 个答案: