PPSlick

个人/初始团队的网站基础弹窗组件库

一个javascript组件库，提供基本的联系我、登录、注册、搜索和邮件订阅之类的弹窗组件（无需写html+css），拿来即用

使用参考

1、搜索组件，参考testsearch.html

//创建一个搜索组件
let searcher = ppSlick.createSearcher();
//回车回调函数
searcher.onSubmit(function (text) {
    console.log(`搜索内容：${text}`);
    //将text内容发送到后端进行搜索
})

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-E5i1Ej8Z-1691652366297)(image/search.png)]

2、联系我组件，参考testcontact.html

let contactMe = ppSlick.createContactMe();
//提交回调函数
contactMe.onSubmit(function (des,type,phone) {
    console.log(`描述内容：${des}`);
    console.log(`业务类型：${type}`);
    console.log(`联系方式：${phone}`);
    //将内容发送到后端进行存储
})

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-MxBfT5pR-1691652366299)(contact.png)]

3、登录组件，参考testlogin.html

let login = ppSlick.createNormalLogin();
//提交回调函数
login.onSubmit(function (userName,password,isRememberme) {
    console.log(`账号：${userName}`);
    console.log(`密码：${password}`);
    console.log(`是否记住我：${isRememberme}`);
})

在这里插入图片描述

4、注册组件，参考testsignup.html

let signup = ppSlick.createNormalSignup();
//提交回调函数
signup.onSubmit(function (userName,password) {
    console.log(`账号：${userName}`);
    console.log(`密码：${password}`);
})

在这里插入图片描述

5、邮件订阅组件，参考testemailsubscribe.html

let emailSubscription = ppSlick.createEmailSubscription();
emailSubscription.setDescription("订阅描述...");
//提交回调函数
emailSubscription.onSubmit(function (email) {
    console.log(`邮箱：${email}`);
})