jQuery cookie，当我按F5时，我可以't注意所选的选项

我的cookie有问题。我正在尝试将所选选项存储在cookie中。但我不明白为什么我的例子不起作用。

例如，不记得字体大小。这是我第一次使用jQuery.cookie。

HTML（在第一次选择，选项内容图像改变背景）：

<h3>Seleccione un fondo de imagen</h3>
<select name="foo" id="foo" size="2">
    <option value="1"></option>
    <option value="2"></option>
    <option value="3"></option>
    <option value="4"></option>
    <option value="5"></option>
    <option value="6"></option>
</select>
<input type="button" id="button1" value="Establecer fondo" />
<h3>Seleccione una fuente</h3>
<select name="fuente" id="fuente" size="2" style='-moz-border-radius: 8px;'>
    <option value="1">Arial</option>
    <option value="2">Tahoma</option>
    <option value="3">Verdana</option>
</select>
<input type="button" id="button2" value="Establecer fuente" />
<h3>Seleccione un tama&ntilde;o de fuente</h3>
<select name="fuentesize" id="fuentesize" size="2" style='-moz-border-radius: 8px;'>
    <option value="1">8</option>
    <option value="2">10</option>
    <option value="3">12</option>
    <option value="4">14</option>
</select>
<input type="button" id="button3" value="Establecer tama&ntilde;o de fuente" />
<h3>Seleccione un color de fuente</h3>
<select name="fuentecolor" id="fuentecolor" size="2" style='-moz-border-radius: 8px;'>
    <option value="1">rojo</option>
    <option value="2">azul</option>
    <option value="3">verde</option>
    <option value="4">rosa</option>
</select>
<input type="button" id="button4" value="Establecer color de fuente" />
<h3>Seleccione un estilo para la fuente</h3>
<select name="fuentestilo" id="fuentestilo" size="2" style='-moz-border-radius: 8px;'>
    <option value="1">cursiva</option>
    <option value="2">subrayado</option>
    <option value="3">sin subrayado</option>
</select>
<input type="button" id="button5" value="Establecer estilo de fuente" />

JavaScript

$(document).ready(function() {
    var value;
    value = $.cookie("cookieFondo");
    if (value) {
        $("#foo").val(value);
    }
    value = $.cookie("cookieFuente");
    if (value) {
        $("#fuente").val(value);
    }
    var value;
    value = $.cookie("cookieFuenteSize");
    if (value) {
        $("#fuentesize").val(value);
    }
    value = $.cookie("cookieFuenteColor");
    if (value) {
        $("#fuentecolor").val(value);
    }
    value = $.cookie("cookieFuentEstilo");
    if (value) {
        $("#fuentestilo").val(value);
    }

    $('#button1').click(function() {
        //alert($('#foo option:selected').text());
        var bg = $('#foo').val();
        if(bg==1){
            $('body').css('background-image', 'url(img/bg00.png)');
            $.cookie("cookieFondo", bg);
        }
        if(bg==2){
            $('body').css('background-image', 'url(img/bg01.png)');
            $.cookie("cookieFondo", bg);
        }
        if(bg==3){
            $('body').css('background-image', 'url(img/bg02.png)');
            $.cookie("cookieFondo", bg);
        }
        if(bg==4){
            $('body').css('background-image', 'url(img/bg03.png)');
            $.cookie("cookieFondo", bg);
        }
        if(bg==5){
            $('body').css('background-image', 'url(img/bg04.png)');
            $.cookie("cookieFondo", bg);
        }
        if(bg==6){
            $('body').css('background-image', 'url(img/bg05.png)');
            $.cookie("cookieFondo", bg);
        }
    });

    $('#button2').click(function() {
        //alert($('#foo option:selected').text());
       var font = $('#fuente').val();
           if(font==1){
            $('body').css('font-family', 'Arial');
            $.cookie("cookieFuente", font);
        }
        if(font==2){
            $('body').css('font-family', 'Tahoma');
            $.cookie("cookieFuente", font);
        }
        if(font==3){
            $('body').css('font-family', 'Verdana');
            $.cookie("cookieFuente", font);
        }
    });
    $('#button3').click(function() {
        //alert($('#foo option:selected').text());
       var fontsize = $('#fuentesize').val();
           if(fontsize==1){
            $('body').css('font-size', 8);
            $.cookie("cookieFuenteSize", fontsize);
        }
        if(fontsize==2){
            $('body').css('font-size', 10);
            $.cookie("cookieFuenteSize", fontsize);
        }
        if(fontsize==3){
            $('body').css('font-size', 12);
            $.cookie("cookieFuenteSize", fontsize);
        }
        if(fontsize==4){
            $('body').css('font-size', 14);
            $.cookie("cookieFuenteSize", fontsize);
        }
    });
    $('#button4').click(function() {
        //alert($('#foo option:selected').text());
       var fontcolor = $('#fuentecolor').val();
           if(fontcolor==1){
            $('body').css('color', 'red');
            $.cookie("cookieFuenteColor", fontcolor);
        }
        if(fontcolor==2){
            $('body').css('color', 'blue');
            $.cookie("cookieFuenteColor", fontcolor);
        }
        if(fontcolor==3){
            $('body').css('color', 'green');
            $.cookie("cookieFuenteColor", fontcolor);
        }
        if(fontcolor==4){
            $('body').css('color', 'pink');
            $.cookie("cookieFuenteColor", fontcolor);
        }
    });
    $('#button5').click(function() {
        //alert($('#foo option:selected').text());
       var fontstyle = $('#fuentestilo').val();
           if(fontstyle==1){
            $('body').css('font-style', 'italic');
            $.cookie("cookieFuentEstilo", fontstyle);
        }
        if(fontstyle==2){
            $('body').css('text-decoration', 'underline');
            $.cookie("cookieFuentEstilo", fontstyle);
        }
        if(fontstyle==3){
            $('body').css('text-decoration' , 'none');
            $.cookie("cookieFuentEstilo", fontstyle);
        }
    });
});