浏览器不会从 onclick 事件中设置 cookie答案

【问题标题】：Browser won't set cookie from an onclick event浏览器不会从 onclick 事件中设置 cookie
【发布时间】：2011-09-04 03:33:23
【问题描述】：

尽管我确信这是显而易见的事情，但我正在为这个错误拉出我的头发。如果是，请道歉。

以下 javascript 成功设置了我的 cookie：

<script type="text/javascript">
$(document).ready(function(){
    $.post('../setCookie.php',{'region':'test'});
});
</script>

但只要我将相同的代码绑定到 onclick 事件，就像这样......

<script type="text/javascript">
$(document).ready(function(){
    $("#us a").click(function(){
        $.post('../setCookie.php',{'region':'en-us'});
    });
    $("#uk a").click(function(){
        $.post('../setCookie.php',{'region':'en-gb'});
    });
});
</script>

<ul>
    <li id="uk"><a href="http://www.example.com/uk">
        <span>Enter UK site</span></a></li>
    <li id="us"><a href="http://www.example.com/us">
        <span>Enter US site</span></a></li>
</ul>

..它不再设置 cookie！即使相同的代码被称为以完全相同的方式执行（我逐步完成它，并看到它应该是的一切）。

重复：javascript 运行良好。我正在逐步浏览 setCookie.php，一切都一样...除了末尾没有 cookie。

发生了什么事？我猜是浏览器安全问题还是什么？

对于任何感兴趣的人，这是我解决它的方法：

<script type="text/javascript">
$(document).ready(function(){
$("#us a").click(function(e){
    e.preventDefault();
    $.post('../setCookie.php',{'region':'en-us'},
        function() {
            window.location = "http://www.example.com/us";
        }
    );
});

$("#uk a").click(function(e){
    e.preventDefault();
    $.post('../setCookie.php',{'region':'en-gb'},
        function() {
            window.location = "http://www.example.com/uk";
        }
    );
});
});
</script>

【问题讨论】：

有什么理由你使用 ajax 调用这个 cookie，而不是仅仅做 document.cookie = ...？ JS 完全能够自行设置 cookie，而无需通过 AJAX 涉及 PHP。
@Marc，我已将它绑定到我在项目其他地方使用的类。我认为将它们放在一起更整洁。但除此之外，没有。
@Marc，$_COOKIE[] 还有时间开火吗？
$_COOKIE 由脚本启动时客户端发送的 cookie 填充。它不会改变以适应您在脚本中进行的任何 setcookie() 调用。您在 PHP 中设置的任何 cookie 只会在脚本的 NEXT 调用时显示在 $_COOKIE 中。
好点。我的意思是 $.cookie（通过 JQuery），但现在可以了，它工作正常，谢谢。

标签： php javascript jquery cookies

【解决方案1】：

我没有看到任何阻止正常链接点击的东西？如果您没有什么可以阻止正常的a href 通过，那么在页面已经更改之前，您将没有时间进行$.post 请求。

尝试以下方法：

$(document).ready(function(){
    $('a').click(function(e){
        e.preventDefault();
        $.post('../setCookie.php',{'region':'test'});
    });
});

它将停止页面更改链接，但至少应该通过 cookie。现在，如果您还希望页面也被加载，那么在请求中添加一个 onComplete 方法，这样一旦成功发送了 cookie 数据，您就可以继续页面更改。

【讨论】：

好吧，即使 setCookie.php 被触发了，并且我一直通过它直到完成，你是绝对正确的：只要我把“preventDefault”放在那里，cookie被写了！我认为这种应该是异步？回到绘图板。谢谢！
我不认为有任何理由不能将window.location = 'http://www.newurl.com'; 放在$.post 之后？
你需要等待请求被发送，否则只会破坏 e.preventDefault() 的目的。
正是因为它是异步的，你才需要preventDefault()。您需要在帖子的成功处理程序中调用 window.location = ''。

【解决方案2】：

将此代码放在标签所在的位置：（我假设

）

$(document).ready(function(){
    $("#us a").click(function(){
        $.post('../setCookie.php',{'region':'en-us'});
    });

    $("#uk a").click(function(){
        $.post('../setCookie.php',{'region':'en-gb'});
    });
});

【讨论】：

这可能是一种更清洁的方法，谢谢，但它仍然不起作用。
我建议获取Firebug（如果您还没有）并查看 ajax 帖子及其响应。它可能与您的 setCookie.php 源有关。如果您发现它是，请随时在此处发布，我会帮助您。

【解决方案3】：

如果是安全问题，您会在控制台上看到错误（firebug\webkit\IE 开发工具）

我想在这种情况下我会做的是改变点击事件并将其放在这里：

<script type="text/javascript">
$(document).ready(function(){
$("#someid > li").click(function(){
    $.post('../setCookie.php',{'region':$(this).attr("id")});
}); 
});
</script>

然后……：

<ul id="someID">
    <li id="uk"><a href="http://www.example.com/uk">
            <span>Enter UK site</span></a></li>
    <li id="us"><a href="www.example.com/us">
                <span>Enter US site</span></a></li>
</ul>

我建议不要在你的 HTML 中使用 JavaScript \ jQuery，只需使用 document.ready() 并绑定你的事件（如果你当然使用 jQuery）

【讨论】：

【解决方案4】：

很可能是因为它在创建之前尝试访问 jQuery ($)。最好使用第一个示例中的document.ready。

【讨论】：

正如我在问题中所说，一切正常。我单步执行代码（即“setCookie.php”）。重复：javascript 正常触发。