javascript - 根据 Cookie 值显示/隐藏 div

Question

我设置了一个供人们填写的表格。其中一个表单字段是县下拉列表。表单操作创建一个 cookie:

setcookie("county", $county, time() + 3600 /* one hour */, '/', 'subdomain.mydomain.com', false, false);

在确认页面上，我有多个默认隐藏的 div:

<div id="county1">County 1 Content</div>
<div id="county2">County 2 Content</div>
<div id="county3">County 3 Content</div> 

等等...

根据用户从上一页的选择下拉列表中选择的县，我希望显示特定的 div。

我尝试过:

<div style="visibility: hidden"><input id="county" name="county" value="<?php echo($_COOKIE['county']); ?>"></div>

和

$('#county').on('load', function () {
    if(this.value === "County1"){
        $("#county1").show();
    } else {
        $("#county1").hide();
    }
}); 

但是input好像不支持onLoad。有什么建议么？

谢谢!!

Answer 1

你尝试过$( document ).ready()

JQuery documentaion

例如；

$(document).ready(function() {
    if($.cookie('county') === "County1"){
        $("#county1").show();
    }else{
        $("#county1").hide();
    }
});

我正在使用 jquery cookie 插件: https://github.com/carhartl/jquery-cookie