/*弹窗购买蛋糕*/
;(function(){ var $DialogBg=$(".Dialogbg-Select");
var $Dialog=$(".Dialog-Select");
var $close=$(".s-closes"); function goBuy(els,opts,disArr,dis) {
this.$els = $(els);
this.$add = this.$els.find(opts.add);
this.$reduce = this.$els.find(opts.reduce);
this.num=1;
this.max=50;
this.oldPrice =0;
this.totalPrice =0;
this.newPrice =0;
this.disArr = disArr;
this.dis = dis;
this._init();
} goBuy.prototype = {
strArr:[],
add:function (ele) { },
reduce:function (ele) { },
/*价格计算*/
counts:function (ele) { },
initialize:function (ele) {
/*初始化数据*/
var self = this; }, showDialog:function () {
$DialogBg.fadeIn();
$Dialog.fadeIn();
},
close:function () {
$DialogBg.fadeOut();
$Dialog.fadeOut();
},
_init:function () {
/*事件*/
var self = this;
this.$els.click(function () {
self.initialize($(this));
}); $close.click(function () {
self.close();
});
$DialogBg.click(function () {
self.close();
});
this.$add.click(function () {
self.add($(this));
});
this.$reduce.click(function () {
self.reduce($(this));
});
}
} new goBuy('.cakeItem',{
add:'.add',
reduce:'.reduce'
},[1,0.7,0.6]); })();
 

js面向对象插件的做法框架new goBuy('.cakeItem',{ add:'.add', reduce:'.reduce' },[1,0.7,0.6]);的更多相关文章

  1. 5分钟搞定jQuery+zepto.js+面向对象插件

    今天分享一下快速使用jQuery+zepto.js的技巧,需要的记得收藏 1.jQuery的引入:本地下载jQuery(后面简称jq)的源文件,开发版本使用非min版,线上使用min版,zepto.j ...

  2. 用js面向对象思想封装插件

    js是基于原型的面向对象语言,如果你学过java,c#等正统面向对象语言,你会难以理解js的面向对象,他和普通的面向对象不太一样,今天,我们通过封装一个toast插件,来看看js面向对象是如何运行的. ...

  3. 原生js日历选择器,学习js面向对象开发日历插件

    在web开发过程中经常会碰到需要选择日期的功能,一般的操作都是在文本框点击,然后弹出日历选择框,直接选择日期就可以在文本框显示选择的日期.开发好之后给用户使用是很方便,但如果每一个日历选择器都要临时开 ...

  4. 手写js面向对象选项卡插件

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  5. JS 面向对象封装 无限轮播 插件。

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  6. Django 的css和js压缩插件:django_compressor

    今天尝试了django_conpressor,一个在django框架中压缩css和js的插件,灰常有用 我把它加载在我的base的HTML template中,原来未经压缩的css和js是: < ...

  7. 前端js面向对象编程以及封装组件的思想

    demo-richbase 用来演示怎么使用richbase来制作组件的例子 作为一名前端工程师,写组件的能力至关重要.虽然javascript经常被人嘲笑是个小玩具,但是在一代代大牛的前仆后继的努力 ...

  8. 关于前端js面向对象编程以及封装组件的思想

    demo-richbase 用来演示怎么使用richbase来制作组件的例子 作为一名前端工程师,写组件的能力至关重要.虽然javascript经常被人嘲笑是个小玩具,但是在一代代大牛的前仆后继的努力 ...

  9. Web3D编程入门总结——面向对象的基础Web3D框架

    本篇主要通过分析Tony Parisi的sim.js库(原版代码托管于:https://github.com/tparisi/WebGLBook/tree/master/sim),总结基础Web3D框 ...

随机推荐

  1. vux弹框显示

    //点击按钮,执行什么成功,失败用这个合适this.$vux.toast.show({ text: '添加成功'}) //点击按钮,提示出现的问题 this.$vux.toast.show({ tex ...

  2. bzoj2555: SubString sam+lct

    题意:懒得写背景了,给你一个字符串init,要求你支持两个操作 (1):在当前字符串的后面插入一个字符串 (2):询问字符串s在当前字符串中出现了几次?(作为连续子串) 你必须在线支持这些操作. 题解 ...

  3. 什么是BFC、IFC、GFC和FFC

    什么是BFC.IFC.GFC和FFC CSS2.1中只有BFC和IFC, CSS3中才有GFC和FFC. FC的全称是:Formatting Contexts,是W3C CSS2.1规范中的一个概念. ...

  4. 安卓——implements——OnClickListener

    //实现底部的按钮激活监听 设置不同src class click implements OnClickListener{ @Override public void onClick(View v) ...

  5. 非常不错的地区三级联动,js简单易懂。封装起来了

    首先需要引入area.js,然后配置并初始化插件: 例: <!-- 绑定银行卡开始 --> <script src="js/area.js"></sc ...

  6. 用swoole简单实现MySQL连接池

    MySQL连接池 在传统的网站开发中,比如LNMP模式,由Nginx的master进程接收请求然后分给多个worker进程,每个worker进程再链接php-fpm的master进程,php-fpm再 ...

  7. 基于Vue + webpack + Vue-cli 实现分环境打包项目

    需求由来:我公司项目上线发布至服务器分为三个环境分别为测试环境.预发布环境.生产环境:前期做法是项目通过脚步打包时由脚步把域名和后缀名之类的全部替换成要发布的环境所需要的,因为我公司的项目比较大由许许 ...

  8. 小程序 wepy wx.createAnimation 向右滑动渐入渐出

    <style lang="less"> .animation { width: 100vw; height: 100vh; opacity: 0; background ...

  9. Linux安装Nginx报错: ./configure: error: C compiler cc is not found

    CentOS 7.3 下 安装 Nginx 执行配置命令 ./configure 时提示以下错误: checking for OS + Linux 2.6.32-431.el6.x86_64 x86_ ...

  10. 基于Quartz.NET 实现可中断的任务(转)

    Quartz.NET 是一个开源的作业调度框架,非常适合在平时的工作中,定时轮询数据库同步,定时邮件通知,定时处理数据等. Quartz.NET 允许开发人员根据时间间隔(或天)来调度作业.它实现了作 ...