Question

我一直遇到让jquery插件工作的问题。应该出现一个jquery窗口，询问用户是否同意或不同意条款。如果用户同意按是，则会存储cookie，窗口将不会返回，直到cookie过期。如果他们按否，它将重定向到另一个网址。

脚本如下。

http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/build-a-popup-modal-window-using-the-jquery-reveal-plugin/

当用户点击是/绿色按钮时，如何集成jquery.cookies.js来编写cookie？我用google搜索回调和事情都无济于事。

如何让揭密插件以这种方式运作？

请帮忙！

（PS 另一个用户提出的问题类似但不一样，因为它通过单击关闭而不是是否按钮来执行相同操作。 What am I doing wrong with this jQuery cookie?）

以下是我到目前为止的内容

<!--jQuery-->
    <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>  -->
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery.reveal.js"></script>
    <script src="js/jquery.cookie.js"></script>


<script type="text/javascript">
$(document).ready(function() {

if (!(jQuery.cookie("agree"))) {  

    $('#modal').reveal({ // The item which will be opened with reveal
                    animation: 'fade',                   // fade, fadeAndPop, none
                    animationspeed: 500,                       // how fast animtions are
                    closeonbackgroundclick: false,              // if you click background will modal close?
                    dismissmodalclass: 'close'    // the class of a button or element that will close an open modal
                });
}
});

$(".close").live("click",function () {
    $.cookie("agree", 1, { expires: 1, path: '/' });
});     
</script>



</head>
<body>


<div id="modal">
<img src="images/images.jpg" alt="image test" width="360" height="194" hspace="0" vspace="0" border="0" align="top">
    <div id="heading">heading/div>

    <div id="content">
        <p>Do you agree yes or no?</p>

        <a href="#" class="button green close"><img src="images/tick.png">Yes</a>

        <a href="http://google.com" class="button red close"><img src="images/cross.png">No</a>
    </div>
</div>

Answer 1

<强> HTML

<div id="modal">

    <img src="images/images.jpg" alt="image test" width="360" height="194" hspace="0" vspace="0" border="0" align="top" />

    <div id="heading">heading/div>

    <div id="content">

    <p>Do you agree yes or no?</p>

      <a id='agree' href="#" class="button green close"><img src="images/tick.png" /> Yes </a>            <a href="http://google.com" class="button red close"><img src="images/cross.png" /> No </a>    

    </div>

</div>

<强> JQUERY

$('document').load(function() {


    //Check cookie value
    if ($.cookie("disclaimer") != 'agree') {

        $('#modal').reveal({ 
            animation: 'fade',                   
            animationspeed: 500,                       
            closeonbackgroundclick: false,
            dismissmodalclass: 'close'    
        });

    }


    // Attach click function to button '#agree' to set cookie
    $("body").on("click", "#agree", function () {
        $.cookie("disclaimer", "agree", { expires: 365, path: '/' });
    });



});

如何使用cookie检测创建常见的jquery免责声明/验证（是/否选项）窗口？

1 个答案: