/*弹窗购买蛋糕*/
;(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. 373. Find K Pairs with Smallest Sums (java,优先队列)

    题目: You are given two integer arrays nums1 and nums2 sorted in ascending order and an integer k. Def ...

  2. PTA L2-002 链表去重

    题目链接:https://pintia.cn/problem-sets/994805046380707840/problems/994805072641245184 第一次做链表题,有时间多看看 解释 ...

  3. stl中的transform()注意其与for_each的不同点(有无返回值)

    #include<iostream> using namespace std; #include"vector" #include"algorithm&quo ...

  4. python- Socket & Mysql 重要知识点

    socket :           解决粘包 并发编程          生产者消费者模型          进程池和线程池          回调函数          GIL全局解释器锁(理论) ...

  5. WDA基础十四:ALV字段属性配置表

    ALV配置表管理 一.字段属性配置表 对于可编辑的ALV不用这个,尽可能多的设置一些控制: 单元格类型:默认A,特殊选择 ZLYE_TYPE        E       A       1      ...

  6. GitHub学习四-查看版本库信息

    首先,只有在本地init以及关联到远程版本库的本地版本库,才能查看版本库信息 1.查看版本库名字 如果忘了名字,直接运行git remote 2.git remote show <name> ...

  7. HTML5新特性 Web Workers 实现多线程

    引子:(JS单线程) 什么是webworker? Web Worker为Web应用程序提供了一种能在后台中运行的方法.通过Web Worker可以生成多个线程同时运行,并保证页面对用户的及时响应,完全 ...

  8. vijos1448校门外的树

    描述 校门外有很多树,有苹果树,香蕉树,有会扔石头的,有可以吃掉补充体力的……如今学校决定在某个时刻在某一段种上一种树,保证任一时刻不会出现两段相同种类的树,现有两个操作:K=1,K=1,读入l.r表 ...

  9. easyUI的form表单重复提交处理

    1. 问题 生产环境出现过新增用户提交, 入库两条重复数据的情况; 但是我查看代码, 页面做了校验, 后台插入数据也做了校验;  出现这种几率的事件的非常小的, 但是还是会碰到, 客户会对我们的产品产 ...

  10. Windows系统目录解释

    目录 说明 C:\Program Files 64位程序安装目录 C:\Program Files (x86) 32位程序安装目录 C:\Windows 操作系统主要目录 C:\Windows\Sys ...