2012-11-15 14 views
10

मैं बूटस्ट्रैप अलर्ट बॉक्स बनाने की कोशिश कर रहा हूं जो याद करता है कि उपयोगकर्ता बंद बटन पर क्लिक करते समय याद करते हैं। मुझे लगता है कि मुझे उस जानकारी को एक कुकी में स्टोर करने की आवश्यकता है। आदर्श रूप से कुकी केवल उस वर्तमान सत्र के लिए चली जाएगी, और अगले वे वापस बॉक्स फिर से दिखाई देंगे।बूटस्ट्रैप का उपयोग करके, अलर्ट बॉक्स को बंद करें

मैं jQuery-कुकी प्लगइन का उपयोग कर रहा हूं। मैंने इसे /jquery-cookie-master पर अपलोड किया। प्लगइन found here हो सकता है।

यह कोड found here कोड का पालन करके मुझे अब तक मिला है।

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="/jquery-cookie-master/jquery.cookie.js"></script> 
<script> 
    function runOnLoad(){ 
     if($.cookie('alert-box') == null) { 
      $.cookie('alert-box', 'open', { expires: 7 }); 
     } else if($.cookie('alert-box') == 'close') { 
      $(".close").hide(); 
     } 

</script> 

HTML:

<body onload="runOnLoad()"> 

<div class="alert alert-info"> 
    <button type="button" class="close" data-dismiss="alert" href="hideMe.php" onclick="hideMe()">×</button> 
    <p> 
    <strong>FORUM UPGRADE:</strong> In light of our recent surge in popularity we upgraded our forum and unfortunately lost all the old threads in the process. 
    </p> 
    <p> 
    In an effort to kick-start the forum again we need your help. Sign up now and leave a post (it's free). Once we reach 100 threads every member will receive a special gift. 
    </p> 
    <p> 
    <a href="http://example.com/forum/#/entry/register"> 
     <strong>Sign up to the forum now</strong> 
    </a>. 
    </p> 
</div> 

</body> 

दुर्भाग्य से यह working.When मैं बंद करें बटन यह है कि कार्रवाई याद नहीं है पर क्लिक करें और अगर मैं पेज को ताज़ा चेतावनी बॉक्स फिर से दिखाई देगा नहीं है।

मैंने क्या गलत किया है?

+0

कर सकते हैं

का उपयोग कर jQuery आप निम्नलिखित कोड का उपयोग कर सकते एक घटना के लिए बाध्य करने के लिए कोई मदद करता है? – bennygill

उत्तर

12

कोड जारी करता

  • अपने कोड में onload समारोह आप कुकी मान जो अजीब है क्योंकि आप केवल जब उपयोगकर्ता चेतावनी बॉक्स बंद कर दिया है कुकी सेट करना चाहते हैं की स्थापना कर रहे हैं।

  • आपके बटन में href विशेषता है। यह आवश्यक नहीं है साथ ही अवैध एचटीएमएल।

समाधान

आदेश बस छिपाने के लिए और चेतावनी बॉक्स आप बंद करें बटन में एक घटना के लिए बाध्य करने के लिए है की राज्य याद ताकि आपको पता है जब उपयोगकर्ता करीब क्लिक किया करने के लिए।

// When document is ready replaces the need for onload 
jQuery(function($){ 

    // Grab your button (based on your posted html) 
    $('.close').click(function(e){ 

     // Do not perform default action when button is clicked 
     e.preventDefault(); 

     /* If you just want the cookie for a session don't provide an expires 
     Set the path as root, so the cookie will be valid across the whole site */ 
     $.cookie('alert-box', 'closed', { path: '/' }); 

    }); 

}); 

आप बस सही कुकी मूल्य के लिए जाँच करनी चाहिए चेतावनी बॉक्स छिपाने के लिए और बॉक्स छिपाने के लिए::

jQuery(function($){ 

    // Check if alert has been closed 
    if($.cookie('alert-box') === 'closed'){ 

     $('.alert').hide(); 

    } 

    // ... Binding code from above example 

}); 
+0

मैं इस एकाधिक divs अलर्ट कैसे लागू कर सकता हूं? शायद $ इस के साथ लेकिन यह नहीं पता कि इसे कैसे कार्यान्वित किया जाए। क्या आप इसके लिए एक पहेली जोड़ना संभव होगा? – user2513846

+0

@ user2513846 मैं प्रत्येक अद्वितीय div अलर्ट में पहचानकर्ता जोड़ने का सुझाव दूंगा। यानी अलर्ट-बॉक्स -1 चेतावनी-बॉक्स -2 आदि – hitautodestruct

+0

लेकिन उन्हें जेएस कोड में कैसे जोड़ सकते हैं? (क्षमा करें मुझे वाक्यविन्यास के साथ अनुभव नहीं हुआ है) – user2513846

संबंधित मुद्दे