我总结的吊炸天的js写法风格

优点有两处,一个是区分了共有方法和私有方法,再一个是页面上事件的this可以传递到类中与类的this区分开来.

注:此风格针对传统jquery写法设计的,不适用于mvvm框架,如ng,vue,avalon等

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title></title><meta charset="utf-8" /><script src="../Scripts/jquery-1.10.2.min.js"></script><script type="text/javascript">(function ($,window) {/***Page类*des:此处代码只提供方法,不提供任何调用和控制*/function Page() {//页面参数this.Param = {Name: "",//姓名Pwd: ""//密码};this.PageType = "";//页面类型//页面控件this.Control = {$name: $("#name"),$pwd:$("#pwd"),$enter: $("#enter")}}//获取用户名Page.prototype.GetName = function () {return this.Param.Name;}//设置页面参数Page.prototype.SetParam=function(){this.Param.Name = this.Control.$name.val();this.Param.Pwd = this.Control.$pwd.val();}//确定按钮--点击事件Page.prototype.enter_Click = function (obj) {var $this = $(obj);var str = pri.strAdd("账号:"+this.GetName(), "密码:"+this.Param.Pwd);alert($this.val()+"###" +str);}//私有方法var pri = {//字符串拼接strAdd: function (str1,str2) {return str1 + "---" + str2;}};//将Page类传递到window对象window.Page = Page;})(jQuery, window);//onload//des:此处代码用于调用和控制$(function () {var page = new Page();page.SetParam();page.Control.$enter.click(function () {page.enter_Click(this);});});</script>
</head>
<body><input type="text" id="name" value="张三" /><input type="password" id="pwd" value="123456" /><input id="enter"  type="button" value="确定" /></body></html>

我总结的吊炸天的js写法风格相关推荐

Three.js之吊炸天的3D元素周期表探究及再开发
吊炸天的3D元素周期表 three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包 ...
阿里那些吊炸天的开源工具，你知道几个？
点击下方公众号「关注」和「星标」回复"1024"获取独家整理的学习资料! 转自:阿里巴巴中间件从人工到自动化,从重复到创新,技术演进的历程中,伴随着开发者工具类产品的发展. 阿 ...
python常用命令汇总-酷帅吊炸天的 Pandas 常用操作命令汇总
非常庆幸自己在有意无意中学习了 Pandas 基础,开始学的时候是觉得它很有意思,功能很强大.然鹅,除了做练习,并没有实际应用.最近工作需要写爬虫,数据处理我就用了 Pandas, 这时才深深体会到其 ...
如何避免贫穷和忙碌，在2018年你需要这样提升自己 2018年01月07日 00:00:00 2099 热文导读 | 点击标题阅读 Java和Android架构2017年总结：文章精选吊炸天！74
如何避免贫穷和忙碌,在2018年你需要这样提升自己 2018年01月07日 00:00:00 2099 热文导读 | 点击标题阅读 Java和Android架构2017年总结:文章精选吊炸天!74款 ...
Pyecharts：pyecharts(图文+代码)实战(柱状图/条形图/散点图、漏斗图、仪表盘、折线/面积图、水球图、地图、平行坐标系、饼图、极坐标系、雷达图、词云图)之绘制各种吊炸天的图表
Pyecharts:pyecharts(图文+代码)实战(柱状图/条形图/散点图.漏斗图.仪表盘.折线/面积图.水球图.地图.平行坐标系.饼图.极坐标系.雷达图.词云图)之绘制各种吊炸天的图表目录 ...
Python语言学习之打印输出那些事：python输出图表和各种吊炸天的字符串或图画、版权声明(如README.md)等之详细攻略
Python语言学习之打印输出那些事:python输出图表和各种吊炸天的字符串或图画.版权声明(如README.md)等之详细攻略目录打印输出标准文档 1.输出表格 2.打印输出各种吊炸天的字符串 ...
Py：Python实现好莱坞《黑客》影视中珠帘似吊炸天的华丽动态加密页面
Py:Python实现好莱坞<黑客>影视中珠帘似吊炸天的华丽动态加密页面目录输出结果实现代码输出结果实现代码 import argparse #命令解析器 import time ...
Sublime Text 3设置吊炸天PHP开发环境
[原创]Sublime Text 3设置吊炸天PHP开发环境 @heiyeluren @created: 2016/5/31 @last modify: 2016/7/8 1. 下载安装Sublime ...
python画图小猪佩奇_吊炸天！Python 20秒画出小猪佩奇
原标题:吊炸天!Python 20秒画出小猪佩奇今年社交平台上的带货女王是谁?范冰冰?杨幂?Angelababy?不,是猪猪女孩小猪佩奇. 小猪佩奇在构图基本是各种曲线,类抛物线.类圆.类椭圆.类二 ...

我总结的吊炸天的js写法风格

我总结的吊炸天的js写法风格相关推荐

最新文章

热门文章