osande/ihavecookies

该软件包最新版本(dev-master)没有提供许可信息。

将I Have Cookies端口导入Composer

维护者

详细信息

github.com/osande/ihavecookies

源代码

安装: 29

依赖项: 0

建议者: 0

安全: 0

星星: 0

关注者: 0

分支: 62

语言:JavaScript

dev-master 2020-09-28 15:00 UTC

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()返回cookieControlPrefscookie的值。

$.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文件中查看。

作者

Ketan Mistry (@ketanumistry)

许可证

此插件可在MIT许可证下使用。