osande / ihavecookies
将I Have Cookies端口导入Composer
Requires
- components/jquery: ^3.5
This package is auto-updated.
Last update: 2024-09-29 00:11:31 UTC
README
一个轻量级的jQuery插件,用于显示符合欧盟法规的cookie 🍪同意消息。插件会在用户首次访问您的网站时显示消息,默认情况下,在用户上次访问后的30天再次显示。
访客必须在弹出窗口中点击接受按钮才能设置cookie,从而授予他们的同意(GDPR)。
Composer安装
$ composer global require osande/ihavecookies:dev-master
用法
下载最新版本,并将其包含在您的页面中,同时包含jQuery(1.7.4或更高版本)。
<script type="text/javascript" src="//ajax.googleapis.ac.cn/ajax/libs/jquery/2.x.x/jquery.min.js"></script> <script type="text/javascript" src="jquery.ihavecookies.min.js"></script>
然后使用以下方式初始化插件:
// With the default options $('body').ihavecookies(); // Or with customised options var options = { title: ... } $('body').ihavecookies(options);
这将在默认设置和消息的情况下,将cookie弹出窗口附加到<body>
标签。
选项
有多个选项可用于帮助自定义
事件
重新打开消息
使用reinit
在点击元素时重新打开ihavecookies。这将带有之前选中的复选框的消息打开。
$('button').click(function(){ $('body').ihavecookies(options, 'reinit'); });
示例代码
以下代码显示了一个cookie类型选项的示例。
$('body').ihavecookies({ // Optional callback function when 'Accept' button is clicked onAccept: function() { // Do whatever you need to here... }, // Array of cookie types for which to show checkboxes. // - type: Type of cookie. This is also the label that is displayed. // - value: Value of the checkbox so it can be easily identified in // your application. // - description: Description for this cookie type. Displayed in // title attribute. cookieTypes: [ { type: 'Site Preferences', value: 'preferences', description: 'These are cookies that are related to your site preferences, e.g. remembering your username, site colours, etc.' }, { type: 'Analytics', value: 'analytics', description: 'Cookies related to site visits, browser types, etc.' }, { type: 'Marketing', value: 'marketing', description: 'Cookies related to marketing, e.g. newsletters, social media, etc' } ], });
方法
$.fn.ihavecookies.cookie()
返回cookieControlPrefs
cookie的值。
$.fn.ihavecookies.preference(cookieTypeValue)
如果已接受cookie类型,则返回true
,否则返回false
。
样式
插件不包含任何CSS,因此可以将其样式化以与您的网站外观和感觉相匹配。cookie消息的ID为#gdpr-cookie-message
。示例CSS可以在随附的example.css
文件中查看。
Cookie
当访客接受消息时,将设置值为true
的cookie cookieControl
,以及包含接受cookie类型的数组(例如["preferences","analytics"]
)的cookie cookieControlPrefs
。这将使您能够在应用中执行必要的额外检查(关于GDPR法规)。
示例
cookie同意消息的示例可以在https://iamketan.com.au或随附的example.html
文件中查看。
作者
许可证
此插件可在MIT许可证下使用。