Execute
Save
Share
Share link
share
share
share
Team
Public Teams
Comments
0
Created By:
Guest
Title:
How do I use jQuery Cookie plu
Title
Description
Edit
Copy Link
Login
Email *
Password *
Login
OR
Create Account
Screen Name *
Email *
Password *
Retype Password *
Team Access Code
Register
Public CodeBins
HELP
--Select Theme--
Ambiance
Blackboard
Cobalt
Eclipse
Elegant
Erlang-Dark
Lesser-Dark
Monokai
Neat
Night
Rubyblue
Vibrant-Ink
Xq-Dark
New CodeBin
CodeBins Versions
How do I use jQ- V.2
How do I use jQ- V.1
Compare Versions
Recent CodeBins
View All CodeBins
$(function() { $("div,input,a,select,option,button,img,td").not(':button[id=btnread],:button[id=btnreset]').click(function() { var clickedText = ""; if (typeof $(this).attr('value') != 'undefined') { clickedText = $(this).attr('value').trim().substring(0, 30); } else { clickedText = $(this).text().substring(0, 30); } var elementClass = " "; var elementID = ""; if (typeof $(this).attr('class') != 'undefined') { if ($(this).attr('class').trim() != "") elementClass += $(this).attr('class').trim(); } if (typeof $(this).attr('id') != 'undefined') { if ($(this).attr('id').trim() != "") elementID += " / " + $(this).attr('id').trim() + " |"; } else { elementClass += " |"; } // Create string var clickedCookie = elementClass.toString() + elementID.toString(); // Print output on delevopment $("#show-cookie").append(clickedCookie + clickedText); //Check Existing Cookie var ckVal = ($.cookie('lastClicked')); if (ckVal != 'undefined' || ckVal != null) { ckVal += " " + clickedText; } else { ckVal = clickedText; } // Set Cookie $.cookie('lastClicked', ckVal, { expires: 2, path: "/" }); $("#show-cookie").show(500); }); $("#btnread").click(function() { var ck = ($.cookie('lastClicked')); alert(ck); }); $("#btnreset").click(function() { $.cookie('lastClicked', ""); $("#show-cookie").html("").hide(400); }); });
Bottom of Page
In Head
On Load
On Ready
Setting
Validate
Copy
Format
span { display:block; margin-top:5px; } .divblock { background:#94dca8; color:#333; width:300px; text-align:center; } .input { border:1px solid #335599; color:#335599; } .selclass { border:1px solid #1122a9; color:#1122a9; background:#94dca8; } .imgclass { border:1px solid #1122a9; } .table { width:50%; border:1px solid #2255dc; } td { text-align:center; } .cell1 { background:#caa8a9; } .cell2 { background:#a8b8ed; } .cell3 { background:#a8bfac; } .btnclass { border:1px solid #333; background:#ada5a4; } .btnclass:hover{ background:#cdcaca; } .cookie{ background:#fda5b7; border:1px solid #fa6289; display:none; }
Setting
Validate
Copy
Format
<span> <div id="show-cookie" class="cookie"> </div> </span> <span> <button id="btnread" class="btnclass"> Read Cookie </button> <button id="btnreset" class="btnclass"> Reset Cookie </button> </span> <span> <div class="divblock"> Div-Text </div> </span> <span> <input type="text" class="input" size="15" value="InputValue" id="txtinput"/> </span> <span> <a href="#" id="aLink" class="linkclass"> My Text Link </a> </span> <span> <select id="select_tag" class="selclass"> <option> Option-1 </option> <option> Option-2 </option> <option> Option-3 </option> <option> Option-4 </option> </select> </span> <span> <img src="http://profile.ak.fbcdn.net/hprofile-ak-prn1/50305_151863314933391_163751676_q.jpg" id="img1" class="imgclass" /> </span> <span> <table class="table" cellspacing="1" cellpadding="1"> <tr> <td class="cell1" id="td1"> Cell-1 </td> <td class="cell2" id="td2"> Cell-2 </td> <td class="cell3" id="td3"> Cell-3 </td> </tr> </table> </span> <span> <input type="button" id="btn1" class="btnclass" value="Submit" /> </span>
No Doc Type
HTML5
HTML 4.01 Transitional
HTML 4.01 Strict
HTML 4.01 Frameset
XHTML 1.1
XHTML 1.0 Transitional
XHTML 1.0 Strict
XHTML 1.0 Frameset
Copy
Format
Download
×
Code Description
×
Difference of Versions
HTML
CSS
JS
×
JS Error
×
CSS Error
Errors
Warnings
×
JavaScript Setting
JS Libraries:
Chrome Frame 1.0.3
Dojo 1.8.0
Dojo 1.7.3
Dojo 1.7.2
Ext Core 3.1.0
jQuery 1.8.0
jQuery 1.7.2
jQuery 1.6.0
jQuery 1.5.0
jQuery 1.4.4
jQuery 1.4.0
jQuery-min 1.7.2
jQueryUI-min 1.8.21
MooTools more-1.4.0.1-full
MooTools core-1.4.5-full
MooTools core-1.4.1-full
Prototype 1.7.1.0
script.aculo.us 1.9.0
SWFObject 2.2
Twitter Bootstrap 2.0.4
WebFont Loader 1.0.28
yui 3.5.1
User Libraries:
Upload File
3
jquery.cookie.js
JavaScript URL(s):
×
CSS Setting
CSS Libraries:
jQueryUI 1.8.21
Twitter Bootstrap 2.0.4
User Libraries:
Upload File
CSS URL(s):