Question

我正在使用jQuery Tools。我想要做的是：用户点击文本链接后，验证是否存在cookie;如果没有，打开一个模态覆盖，要求他选择一个区域;一旦他这样做，将其存储在cookie中，然后打开主叠加层。

如果cookie已存在，则直接打开主叠加层。

到目前为止我所拥有的是：

$(function() {

// if the function argument is given to overlay,
// it is assumed to be the onBeforeLoad event listener
$("a[rel]").live('click', function (e){
    e.preventDefault();

    var el = $(this);
    var target = el.attr('rel');
    $(target).appendTo('body');

    $(this).overlay({
    mask: {color:'black'},
    effect: 'apple',
    api: true,

    onBeforeLoad: function() {

// grab wrapper element inside content
        var wrap = this.getOverlay().find(".contentWrap");

        // load the page specified in the trigger
        wrap.load(this.getTrigger().attr("href"));

    },
    load:true,
    closeOnClick: false

     });
});
});

我知道在某些时候，我应该有这样的事情：

        if ($.cookie('myRegion') == null){ 
            $("#selectRegion").overlay().load();
        }

但我不确定它适合的地方。任何人都知道如何实现这个目标吗？

Answer 1

首先，只需确认，确保您正在加载jQuery Cookie。

这可能看起来像一个简单的解决方案，但基本上它会检查cookie，如果它不存在然后创建对话框，并关闭对话框或保存选择，具体取决于是否单击了背景或按钮。

为你的jQuery尝试类似的东西：

$(document).ready(function(){
    if($.cookie("myRegion") == null){
        $("#modal-background").toggleClass("active");
        $("#modal-content").toggleClass("active");
    }

    $("#modal-background").click(function(){
        $("#modal-background").toggleClass("active");
        $("#modal-content").toggleClass("active");
    });
    $("#modal-save").click(function(){
        $.cookie("myRegion", $("region").val());
        $("#modal-background").toggleClass("active");
        $("#modal-content").toggleClass("active");
    });
});

所有关联的HTML和CSS都可以在这个小提琴中找到：http://jsfiddle.net/9HrwN/2/

在主叠加之前打开模态叠加

1 个答案: