Jquery.cookie 插件的问题答案

【问题标题】：Issues with Jquery.cookie pluginJquery.cookie 插件的问题
【发布时间】：2014-11-19 00:26:27
【问题描述】：

我已经研究了几篇关于这个主题的问答和文章，我似乎在这里犯了一个错误。我已将此代码包含在我的 $(document).ready javascript 中，并将其加载到我的 index.html 的末尾。使用的两个 ID 都正确插入 HTML 并查看 Jquery.cookies 文档，我没有看到我忘记的内容。是不是我应该在 HTML 的开头加载 cookie 函数？

按钮切换到正确语言的 HTML 文件的 HTML...

<div class="col-xs-12 col-sm-6 col-md-6"><br>
        <h1>Comment aimeriez vous être servi?</h1><a href="fr.html">
          <div id="set_fr_button" class="btn btn-primary btn-lg text-center">En Français</div></a>
      </div>
      <div class="col-xs-12 col-sm-6 col-md-6"><br>
        <h1>How would you liked to be served?</h1><a href="en.html">
          <div id="set_en_button" class="btn btn-primary btn-lg text-center">In English</div></a>
      </div>

包含 cookie 代码的 JS 文件...

        $(function () {

    var url = 'mannydesigns.co';
    var en_page = 'en.html';
    var fr_page = 'fr.html';

    if ($.cookie('default_page') != null) {
        if (window.location.href != url + '/' + $.cookie('default_page')) {
            window.location.href = url + '/' + $.cookie('default_page');
        }
    }

    $('#set_en_button').click(function () {
        $.cookie('default_page', en_page, { expires: 999 });
    });

    $('#set_fr_button').click(function () {
        $.cookie('default_page', fr_page, { expires: 999 });
    });

    });

【问题讨论】：

你试过使用调试器吗？控制台有错误吗？
是的，但我找到了解决方案，请看下面的答案。

标签： javascript jquery html cookies

【解决方案1】：

不确定你有什么问题，但我在你的代码中发现了一些问题。

首先，链接中不需要<div>。

<div class="col-xs-12 col-sm-6 col-md-6"><br>
    <h1>Comment aimeriez vous être servi?</h1>
    <a href="fr.html" id="set_fr_button" class="btn btn-primary btn-lg text-center">En Français</a>
</div>
<div class="col-xs-12 col-sm-6 col-md-6"><br>
    <h1>How would you liked to be served?</h1>
    <a href="en.html" id="set_en_button" class="btn btn-primary btn-lg text-center">In English</a>
</div>

其次，你的点击事件功能永远不会起作用，你应该在设置cookie之前使用e.preventDefault();防止加载新页面。

$(function () {
    var url = 'mannydesigns.co';
    var en_page = 'en.html';
    var fr_page = 'fr.html';

    if ($.cookie('default_page') != null) {
        if (window.location.href != url + '/' + $.cookie('default_page')) {
            window.location.href = url + '/' + $.cookie('default_page');
        }
    }

    $('#set_en_button').click(function (e) {
        e.preventDefault();
        $.cookie('default_page', en_page, { expires: 999 });
        window.location.href = $(this).attr('href');
    });

    $('#set_fr_button').click(function (e) {
        e.preventDefault();
        $.cookie('default_page', fr_page, { expires: 999 });
        window.location.href = $(this).attr('href');
    });
});

【讨论】：

它仍然不起作用，它给我的错误是“未捕获的类型错误：未定义不是下面一行的函数......???if ($.cookie('default_page') != null) {我的代码就像你上面建议的那个...
我正在测试将这段代码分离成自己的代码，而不是将其放入我的 $(document).ready main.js 文件中。
你是否正确加载了jquery cookie？我测试的时候没有发现任何问题。
我刚找到解决办法看我自己上面的回答。

【解决方案2】：

对我有用的是隔离此代码并最后加载它，当它工作时我意识到当我已经在主页上时代码也在添加 URL，因此找不到正确的 HTML 页面...所以最终的工作代码如下（基本相同，删除我的 if 语句中的 url，没有 e.preventdefault 因为它不需要）：

  $(function () {

var url = 'mannydesigns.co';
var en_page = 'en.html';
var fr_page = 'fr.html';

if ($.cookie('default_page') != null) {
    if (window.location.href != '/' + $.cookie('default_page')) {
        window.location.href = '/' + $.cookie('default_page');
    }
}

$('#set_en_button').click(function () {
    $.cookie('default_page', en_page, { expires: 999 });
});

$('#set_fr_button').click(function () {
    $.cookie('default_page', fr_page, { expires: 999 });
});

});

【讨论】：