استفاده از cookie در jquery

استفاده از cookie در jquery

شاید براتون اتفاق افتاده باشه که بخواین کوکی ست کنید اما زبان برنامه نویسیتون دست شمارو باز نذاره و مجبور باشید با جی کوئری کوکی ست کنید. مثلا میخواین کاربر که سایت رو باز میکنه یه پاپ آپ براش تو صفحه باز بشه و پیغامی رو نمایش بده و بعد از بستن اون پاپ آپ مثلا تا ۳۰ رو دیگه زمانی که سایت رو باز میکنه این پاپ آپ رو نبینه.

خوب اینجا دیگه نمیتونید با php یا هر زبان برنامه نویسی دیگه ای این کار رو انجام بدید. چون پاپ آپ شما با جی کوئری کار میکنه. در این لحظه شما باید از پلاگین کوکی جی کوئری استفاده کنید.

تو این مقاله ی آموزشی قصد دارم کوکی جی کوئری رو بهتون معرفی کنم و نحوه ی کار با اون رو خدمتتون آموزش بدم. خیلی سادست.

ابتدا این پلاگین رو دانلودکنید.

زمانی که فایل رو دانلود می کنید و از حالت فشرده خارج می کنید، چندین فایل رو مشاهده می کنید. این فایل ها برای developer ها هست و ما در حال حاضر نیازی به اونها نداریم. خوب وارد پوشه ی src بشید و فایل jquery.cookie.js رو در پوشه ی پروژه ی خودتون کپی کنید. حالا نسبت به مسیر پروژه ی خودتون اون رو به صفحه ای که نیاز دارید اضافه کنید.

    
<script src="jquery.cookie.js"></script>

خوب تا اینجا شما این پلاگین رو به صفحتون اضافه کردید، حالا باید اون رو برای پروژتون تعریف کنید.

 
نحوه ی کار با Jquery Cookie Plugin

نحوه ی ست کردن کوکی با این پلاگین :

یه اسم برای کوکی انتخاب می کنید و یک مقدار به اون اختصاص میدید.

$.cookie('name', 'value');

تعیین زمان انقضاء برای کوکی:

زمان رو به روز وارد می کنیم ، مثلا این کوکی که ست کردیم بعد از ۷ روز منقضی میشه

$.cookie('name', 'value', { expires: 7 });

 نحوه ی خوندن کوکی :

با استفاده از نامی که بهش دادید، میتونید اون رو شناسایی کنید

$.cookie('name');

نحوه ی حذف کوکی مورد نظر :

کافیه اسم کوکی مورد نظر رو وارد کنید

$.removeCookie('name');

مثال برای استفاده از پلاگین کوکی جی کوئری

خوب برای درک بهتر یه مثال براتون میزنم، فرض کنید یک پاپ آپ عضویت در خبرنامه داریم و میخوایم اولین بار که کاربر سایت رو باز میکنه بهش نمایش داده بشه و زمانی که کاربر دکمه ی close رو کلیک کرد به مدت ۱ روز دیگه این پاپ آپ بهش نمایش داده نشه.

اسم این کوکی رو NewsLetter میذاریم. دکمه بستن رو هم با id و شناسه ی close در html مون مشخص می کنیم. حالا میگیم اگر کوکی با نام Newsletter وجود نداشت ، در ابتدا پاپ آپ رو باز کن و نمایش بده، حالا اگر دکمه ی بستن رو کاربر کلیک کرد ، این کوکی رو ست کن.

کد html فرضی :

<div class="ShowLayerNewsLetter">
    <i id="close">بستن</i>
    <form>
        ....
    </form>
</div>

کد جی کوئری :

$(function () {
  

      if(!$.cookie('NewsLetter'))
  

        {
  

          $(".ShowLayerNewsLetter").fadeIn('fast');
  

          $("#close").click(function(){
  

              $.cookie('NewsLetter', 'yes', { expires: 1 });
  

              $(".ShowLayerNewsLetter").fadeOut('fast');
  

          });
  

        }
  

  });

با این کدی که نوشتیم در اولین بازدید کاربر، پاپ آپ خبرنامه به کاربر نمایش داده میشه، اگر کاربر دکمه بستن رو کلیک کنه دیگه هر چقدرم سایت رو باز کنه به مدت ۱ روز پاپ آپ رو نمیبینه. اینطوری کاربر رو اذیت نمیکنید.

خوب دوستان آموزش به اتمام رسید. امیداورم که مقاله ی مفیدی بوده باشه.

موفق و پاینده باشید.

نگاه دیگران

نگاه دیگران

نگاه دیگران نگاهی است از دنیای گسترده صفحات گوناگون اینترنت که منتخبی از آن‌ها را در پایگاه خبری چهره و اخبار مشاهده میکنید.


0 نظر درباره‌ی این پست نوشته شده است.

ثبت نظر