Question

I have a function to set cookies, and i have .bind() set on some of my links so that they trigger the cookie function when clicked. Right now, when they are clicked no cookie is set. I’ve spent hours on this and cant figure it out.

<script type="text/javascript"> function createCookie(name,value,days) { 
if (days) {
    var date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    var expires = ";
 expires=" + date.toGMTString();
}
else {
    var expires = "";
}
document.cookie = name + "=" + value + expires + "; path=/";
}
$("a#en").bind("click", function () {
    createCookie('TR_LNG', 'en', 90);
});
$("a#fr").bind("click", function () {
    createCookie('TR_LNG', 'fr', 90);
});
$("a#de").bind("click", function () {
    createCookie('TR_LNG', 'de', 90);
});
$("a#ja").bind("click", function () {
    createCookie('TR_LNG', 'ja', 90);
});
$("a#pl").bind("click", function () {
    createCookie('TR_LNG', 'pl', 90);
});
$("a#es").bind("click", function () {
    createCookie('TR_LNG', 'es', 90);
});
</script> 

HTML

<div id="langselectsplash" class="langselectsplash">
    <div id="select">
        <img src="http://mysite.org/wp-content/uploads/2012/08/sarvalogo2.png"
        />
        <p>
            <style>
            #tr_setdeflang {
                display:none;
            }

            </style>
            <div class="no_translate transposh_flags">
                <a id="en" href="/about/" class="tr_active">English</a>
                <a id="fr" href="/fr/about/">Français</a>
                <a id="de" href="/de/about/">Deutsch</a>
                <a id="ja" href="/ja/about/">日本語</a>
                <a id="pl" href="/pl/about/">Polski</a>
                <a id="es" href="/es/about/">Español</a>
            </div>
        </p>
    </div>
</div>
<div id="langsplashfade"></div>

The PHP code that outputs the above:

<?php
echo "<script type=\"text/javascript\"> function createCookie(name,value,days) { \nif (days) { \nvar date = new Date();\n date.setTime(date.getTime()+(days*24*60*60*1000));\n var expires = \";\n expires=\"+date.toGMTString();\n} else { \nvar expires = \"\";}document.cookie = name+\"=\"+value+expires+\"; path=/\";}\n";
foreach ($args as $langrecord) {
    echo "$(\"a#{$langrecord['isocode']}\").bind(\"click\", function() {createCookie('TR_LNG','{$langrecord['isocode']}',90);});\n";
}
echo "</script>";
?>
   <?php
echo " <div id=\"langselectsplash\" class=\"langselectsplash\"><div id=\"select\"><img src=\"http://mysite.org/wp-content/uploads/2012/08/sarvalogo2.png\" /><p>";
?>
           <?php
echo "<style>#tr_setdeflang{display:none;}</style><div class=\"" . NO_TRANSLATE_CLASS . " transposh_flags\" >";
foreach ($args as $langrecord) {
    echo "<a id=\"{$langrecord['isocode']}\" href=\"{$langrecord['url']}\"" . ($langrecord['active'] ? ' class="tr_active"' : '') . '>' . "{$langrecord['langorig']}</a>";
}
echo "</div>";
?>

Answer 1

You need to put the code where you are binding events on the DOM ready event:

$(document).ready(function(){
//Your code
});

or

$(function(){
//Your code
});