define(['backbone', 'jquery', 'text!creditCardTpl/page.html'], function (bacobone, jquery, dialog_tpl) {
var dialogView;
dialogView = Backbone.View.extend({
events: {
"touchstart #dialog_ok": "okcallback",
"touchstart #dialog_cancel": "cancelcallback"
}, okcallback: function () {
this.closeDialog()
},
cancelcallback: function () {
this.closeDialog()
},
closeDialog:function(){
if(this.timeCount){
window.clearTimeout(this.timeCount)
}
/* this.$el.css("display","none")*/
this.$el.detach() /*不能用remove,,remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除*/
},
initialize: function () { },
ul_tpl:$(dialog_tpl).filter("#dn_ul").html(),
tpl: $(dialog_tpl).filter("#dialog_one").html(),
dialog:function(cssParm){ var Css={contentTpl:this.ul_tpl}
/* var Css={width:"",height:"",left:"",top:"",title:"",contentTpl:"",timeClose:""}*/
_.extend(Css,cssParm)
this.render(Css)
},
render: function (parm) {
this.$el.html(this.tpl)
this.$(".dialog_title").html(parm.title)
this.$(".dialog_content").html(parm.contentTpl)
if (parm.width &&parm.width != "") {
this.$(".dialog_box").css("width", parm.width)
}
if(parm.shadow==false) {
this.$(".dialog_shadow").css("display","none")
}
$("html body").append(this.$el)
if(!parm.left||parm.left==""){
parm.left=( window.screen.width-this.$(".dialog_box ").width())/2
/* this.$(".dialog_box").css("left",left)*/
}
if(!parm.top||parm.top==""){
parm.top=( window.screen.height-this.$(".dialog_box ").height())/2 -200
/* this.$(".dialog_box").css("left",left)*/
}
this.$(".dialog_box").css({"left": parm.left, "top": parm.top})
if(parm.timeClose){ this.timeCount=window.setTimeout(function(){
this.closeDialog()
}.bind(this),parm.timeClose)
}
} }); return dialogView; });

  

基于 backbone的弹窗插件的更多相关文章

  1. 封装基于jq弹窗插件

    相信码友们对于$.fn.extexd();$.extend()以及$.fn.custom和$.custom都有一定的了解:我阐述一下我自己对于$.fn.custom和$.custom的理解.有理解错误 ...

  2. 原生Js弹窗插件|web弹出层组件|对话框

    wcPop.js 是一款基于原生javascript开发的前端 web版 弹窗组件,遵循原生 H5/css3/JS 的书写规范,简单实用.拿来即用(压缩后仅10KB).已经兼容各大主流浏览器.内含多种 ...

  3. 一款基于react-native的弹窗提示组件

    介绍一款基于react-native的弹窗提示插件 react-native-ms , github地址:https://github.com/jiangzhenfei/react-native-ms ...

  4. ExtJS4.2学习(13)基于表格的扩展插件---rowEditing

    鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-24/182.html --------------- ...

  5. Web APP & 弹窗插件

    Web APP & 弹窗插件 移动端弹窗插件 alert.confirm.toast.notice 四种类型弹窗 jQuery & Zepto https://github.com/s ...

  6. jquery弹窗插件layer:layer.layui.com

    这两天在做抽奖转盘功能,浏览器自带的alert弹出框太low,本人又基本不会前端, 于是借鉴前人用fancybox插件做的效果 结果没看懂其写法(http://www.0101shop.com/goo ...

  7. thinkphp 点击某个class提交post值,返回回来用一个弹窗插件,提示返回来要说的话

    下一篇文章有讲到弹窗插件的怎么使用,自写教程 如果能帮到你,给点个赞鼓励一下 <=============  控制器  =================> public function ...

  8. JS编写简单的弹窗插件(含有demo和源码)

    最近项目做完了 事情不是很多,今天正好也在调休,所以趁着这个时间研究了一下简易的JS弹窗功能,当然网上这块插件非常多,本人也没有仔细看网上的插件源码 只是凭着日常使用过的弹窗插件有这么多功能 来实现自 ...

  9. 基于jquery下拉列表树插件代码

    分享一款基于jquery下拉列表树插件代码.这是一款实用的jquery 树形下拉框 下拉树代码下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: <table width= ...

随机推荐

  1. android studio ndk 调试

    一: 先看看用 ndk-gdb 手动调试 这种方法只适用于手动编写 Android.mk 的情况,因为我们要手动 build debug 版本的 .so 文件.具体可以参考我的前一篇文章. 1 And ...

  2. Ubuntu 14.04 MySQL同步

    主服务器:192.168.2.212 从服务器:192.168.2.211   主服务器(192.168.2.212): 先到/etc/mysql/my.cnf下 将 bind-address 127 ...

  3. BZOJ4340 : BJOI2015 隐身术

    枚举$B$串的每个后缀,统计出该后缀所有满足条件的前缀. 考虑暴力搜索,设状态$(x,y,z)$表示当前需要考虑$A$从$x$开始的后缀,$B$从$y$开始的后缀,之前部分编辑距离为$z$. 那么首先 ...

  4. svg―Raphael.js Library

    Raphael是一个用于在网页中绘制矢量图形的Javascript库,它使用SVG W3C推荐标准和VML作为创建图形的基础,可以通过JavaScript操作DOM来轻松创建出各种复杂的柱状图.饼图. ...

  5. CentOS6.4 内核优化

    vi /etc/sysctl.conf net.ipv4.tcp_syncookies = net.ipv4.tcp_tw_reuse = net.ipv4.tcp_tw_recycle = net. ...

  6. FFmpeg - 音频解码过程

    1. 注册所有解码器 av_register_all(); 2. Codec & CodecContext AVCodec* codec = avcodec_find_decoder(CODE ...

  7. Hadoop及子项目备注

    Hadoop CommonHadoop体系最底层的一个模块,为Hadoop各子项目提供各种工具,如:配置文件和日志操作等. AvroAvro是doug cutting主持的RPC项目,有点类似Goog ...

  8. 如何使用 Migration创建一个迁移

    切换到YII所在的目录 yii migrate/create test

  9. POJ 1419 Graph Coloring(最大独立集/补图的最大团)

    Graph Coloring Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 4893   Accepted: 2271   ...

  10. 修改linux系统时间的方法(date命令)

    修改linux系统时间的方法(date命令) 来源:互联网 作者:佚名 时间:11-18 23:22:27 [大 中 小] date命令不仅可以显示系统当前时间,还可以用它来修改系统时间,下面简单的介 ...