/*弹窗购买蛋糕*/
;(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. CF-831D Office Keys 思维题

    http://codeforces.com/contest/831/problem/D 题目大意是在一条坐标轴上,给出n个人,k把钥匙(k>=n)以及终点的坐标,所有人都可以同时运动,但不可以公 ...

  2. Confluence 6 删除一个空间

    删除一个空间将会完全删除空间和空间的所有内容,包括有关这个空间的所有日历,和链接到这个空间中的问题.只有具有空间管理员权限的用户才能够完全删除一个空间.  删除空间是完全从系统中删除的.一旦你删除了一 ...

  3. Vmware安装Kali

    下载软件 破解版的Vmware14 kali(我的是kali-linux-2018.2-amd64) 配置虚拟机 新建虚拟机,选择自定义 虚拟机硬件兼容性 选择虚拟机硬件兼容性为Workstation ...

  4. 小程序传id值

    xml文件 <view class='bgcf bsbb pl30 pr30 pt30 pb30 df fww' >       <block wx:for="{{intr ...

  5. js中去掉字符串的空格、回车换行

    //例如下面这个json串,中间的\n表示换行 var str = "{' retmsg':'success ',\n' trans_date':' 20170906'}"; co ...

  6. python 小练习 7

    有一楼梯共n级,刚开始时你在第一级,若每次只能跨上一级或二级,要走上第n级,共有多少种走法? 这其实是fibonacci数列,记走法为f(n),在n-1和n-2时你都可以直接跨上去.因此 f(n) = ...

  7. MongoDB 教程(二):MongoDB 简介

    概述: MongoDB 旨在为WEB应用提供可扩展.高性能的数据存储解决方案. MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成. MongoDB 文档类似于 ...

  8. Hadoop---Exception in thread "main" java.lang.NullPointerException问题的解决

    Exception in thread "main" java.lang.NullPointerException问题的解决 解决:  首先我们来分析下这个问题,我是使用debug ...

  9. django学习之——我的 Hello World

    pycharm 打开django 创建的项目:添加views.py文件 修改 urls.py from django.conf.urls import patterns, include, url f ...

  10. vue相关操作命令

    全局安装:npm install vue-cli -g 全局卸载:npm uninstall vue-cli -g 查看vue版本:vue -V 回车