在jquery对话框中设置cookie，并在提交邮政编码后在页面上显示选定的值

Question

我正在制作一个页面，人们必须填写他们的邮政编码，以便他们可以搜索附近地区的工厂。

我使用了jquery模式对话框，人们必须输入他们的邮政编码并点击提交。然后我想要设置一个cookie，这样当用户第二次进入该网站时，邮政编码仍然设置。所以他可以直接搜索工厂。

我有这个弹出窗口：

人们必须在那里填写邮政编码，然后点击opslaan（保存）

在这里，您可以看到带有搜索功能的主页。人们可以在不同的公里搜索。

我想要一个带有填写的邮政编码的标签或其他内容，以便人们可以使用他们的邮政编码进行搜索。

编辑：

我的jquery对话框代码：

$(function() {

$( "#dialog" ).dialog(
{ 
show: "slow",
modal: "true",
width: 600,
show: "fold",
hide: "fade",
resizable: false,
draggable: false,
buttons: [ { id: "go", text: "Opslaan", click: function() { $( this ).dialog( "close" ); } } ],
open: function(event, ui) { $(".ui-dialog-titlebar-close").hide();  }});
$(".ui-widget-overlay").css({background: "#000", opacity: 0.8});
});

当我输入此代码时：

<input type="text" id="postcode" value="" name="search"/>
<button id="go">Opslaan</button>

在jquery对话框的div中。它不起作用。

<div id="dialog" title="Welkom bij OostWestRegioBest.nl">
  <p>Vul hier uw postcode in en druk op opslaan:</p>
  <br />


</div>

Answer 1

我在这里推荐jquery cookie：https://github.com/carhartl/jquery-cookie

然后你会做

$.cookie('postcode', $('#postcode').val());

设置它，然后阅读它：

if(typeof $.cookie('postcode') !== 'undefined'){
    $('#postcode').val($.cookie('postcode'));
}

因此，例如，如果您有以下HTML：

<input type="text" id="postcode">
<button id="go">Go!</button>

然后你的JS看起来像这样：

$(document).ready(function(){
    //story the cookie on button press
    $('#go').click(function(){
            $.cookie('postcode', $('#postcode').val());        
    });

    //retrieve the cookie on load if it's not undefined
    if(typeof $.cookie('postcode') !== 'undefined'){
            $('#postcode').val($.cookie('postcode'));
    }
});

以下是一个有效的示例：http://tinker.io/38617/4

Answer 2

function setCookie(sName, sValue) {

    if(getCookie(sName)==null) {
        if(isValidUsrURL(path)) {
            document.cookie = sName + "=" + escape(sValue) + "; " +
                "path=/; ";
        } else {
            domainname='.example.com';
            document.cookie = sName + "=" + escape(sValue) + "; " +
                "path=/; domain=" + domainname + "; ";
        }
    }


}

function getCookie(sName) {

    // cookies are separated by semicolons
    var aCookie = document.cookie.split("; ");
    for (var i=0; i < aCookie.length; i++) {
        // a name/value pair (a crumb) is separated by an equal sign
        var aCrumb = aCookie[i].split("=");
        if (sName == aCrumb[0]) {
            return unescape(aCrumb[1]);
        }
    }
    // a cookie with the requested name does not exist
    return null;

}

function deleteCookie(sName) {
    document.cookie = sName + "=; expires=Thu, 01-Jan-70 00:00:01 GMT";
}


//EG usage : 
//deleteCookie('brochTabURL', '/', '.example.com');
//setCookie('brochTabURL', document.location.href );
//setCookie("COOKIE_CHECK","YES");
//var loginId = getCookie("COOKIE_CHECK");