Question

我正在使用本教程在我的网站上创建一条弹出消息：LINK

当用户使用IE7或更低版本时，它应该只显示/弹出，并且只能使用一次 - 所以我需要使用cookie。

本教程使用名为“Reveal”的jQuery插件，并按如下方式激活：

<script type="text/javascript">
$(document).ready(function() {
    $('#button').click(function(e) {        // Button which will activate our modal
        $('#modal').reveal({                // The item which will be opened with reveal
            animation: 'fade',              // fade, fadeAndPop, none
            animationspeed: 600,            // how fast animtions are
            closeonbackgroundclick: true,   // if you click background will modal close?
            dismissmodalclass: 'close'      // the class of a button or element that will close an open modal
        });
    return false;
    });
});

与此脚本一起使用的HTML是这样编写的：

    <div id="modal">
        <div id="heading">
            Are you sure you want to do that?
        </div>
        <div id="content">
            <p>Clicking yes will make Comic Sans your new system<br> default font. Seriously, have you thought this through?</p>
            <a href="#" class="button green close"><img src="images/tick.png">Yes, do it now!</a>
            <a href="#" class="button red close"><img src="images/cross.png">No, I’m insane!</a>
        </div>
    </div>

我尝试使用THIS脚本自己将Cookie添加到"Reveal"-plugin，但没有运气：

<script type="text/javascript">
    $(document).ready(function() {
        if ( $.cookie ( 'first_visit' ) !== '0' ){
            $('#modal').reveal({                // The item which will be opened with reveal
                animation: 'fade',              // fade, fadeAndPop, none
                animationspeed: 600,            // how fast animtions are
                closeonbackgroundclick: true,   // if you click background will modal close?
                dismissmodalclass: 'close'      // the class of a button or element that will close an open modal
            });
            $.cookie( 'first_visit' , '0' );
        return false;
        }
    });
</script>

我做错了什么？我希望这个弹出消息显示在IE7及以下 - 仅在第一次访问该网站时。

Answer 1

如果你想在IE上显示它只使用IE条件标签

<!--[if lt IE 8]>
<script type="text/javascript">
... your code ...
</script>
<![endif]-->

IE Conditional Comment

还养成在调试时测试变量的习惯

<script type="text/javascript">
    $(document).ready(function() {
        var cookie = $.cookie('first_visit');
        alert(cookie); // this will show you why it is not workin
        ....

Answer 2

script.js第12行有错误。您正在使用名为validationEngine的方法。你确定加载了这个，因为我没有在任何地方看到它。您也可以尝试在控制台中键入$.validationEngine，它会告诉您它未定义。这可能会阻止你的javascript执行。

要么确保包含此验证引擎，要么不使用它，如果错误仍然存在，请返回。从我所看到的，你对cookie插件的说法是正确的。它也已初始化，我可以通过控制台在您的网站上使用它。

修改

调用模态化器初始化后，您返回false。我想这是因为你从属于html锚点（<a />）上的点击事件的代码中复制了它，并且它需要停止执行默认操作（转到链接）。在这种情况下，我认为它没有做任何事情，但在$ .ready上返回false似乎本能地就像一个非常糟糕的主意。摆脱它！

使用Cookie在页面加载上显示弹出消息

2 个答案: