<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="../jquery.min.js"></script>
<script>
(function(){
var RentNumObj = {};
RentNumObj.geocount = 0;
RentNumObj.tarDomId = "";
RentNumObj.rentJson = {};
var seed = 1;
var prefix = "dom00";
var selobjid = null;
var delobjid = null;
function getGeocount () {
return RentNumObj.geocount;
}
function setGeocount (val) {
RentNumObj.geocount = val;
}
function getTarDomId () {
return RentNumObj.tarDomId;
}
function setTarDomId (val) {
RentNumObj.tarDomId = val;
}
function getRentnumArr () {
return RentNumObj.rentnumArr;
}
function setRentnumArr (val) {
RentNumObj.rentnumArr = val;
}
function checkRentValLose () {
var rentJson = RentNumObj.rentJson;
for (var p in rentJson){
if( rentJson[p] == undefined || rentJson[p] == null ){
return false;
}
}
return true;
}
function checkTarget () {
var args = arguments;
var tarid = RentNumObj.tarDomId;
if( tarid == "" ){
RentNumObj.tarDomId = tarid = args[0];
}
return $("#"+tarid);
}
function print () {
// console.log("geocount:", RentNumObj.geocount);
// console.log("tarDomId:", RentNumObj.tarDomId);
// console.log("rentnumArr:", RentNumObj.rentnumArr);
// console.log("rentJson:", RentNumObj.rentJson);
// console.log("=========================");
$("#panel").html("");
$("#panel").append("<div>geocount: "+RentNumObj.geocount+"</div>");
$("#panel").append("<div>tarDomId: "+RentNumObj.tarDomId+"</div>");
$("#panel").append("<div>rentnumArr: "+RentNumObj.rentnumArr+"</div>");
$("#panel").append("<div>rentJson: "+RentNumObj.rentJson+"</div>");
}
function print2(){
$("#panel2").html("");
$("#panel2").append("<div>selobjid: "+ selobjid +"</div>");
$("#panel2").append("<div>rentnum: "+ rentJson[selobjid] +"</div>");
} //var pt = RentNumObj.prototype;
var pt = RentNumObj;
pt.add = function(){
print();
var tarobj = checkTarget("intext");
//tarobj[0].value = "";
var geocount = getGeocount(); if(geocount > 0){
var tarval = tarobj[0].value;
if( !checkRentValLose() ){
//if( tarval == "" ){
alert("未绑定租金值,请填写租金值!");
tarobj[0].value = "";
return false;
//}
}
}
selobjid = prefix + seed;
seed = seed + 1;
//$("#panel").append("<div id='"+selobjid+"' width='20' height='10' style='background-color:yellow;'>"+selobjid+"</div>");
$("body").append("<input type='button' id='"+selobjid+"' class='btnCls' value='"+selobjid+"'>"); $(".btnCls").bind("click", RentNumObj.sel);
geocount = geocount + 1;
setGeocount(geocount);
RentNumObj.rentJson[selobjid] = null;
print();
};
pt.del = function(){
print();
if( delobjid == null){
alert("请先选择!");
return false;
}
var rentJson = RentNumObj.rentJson;
delete rentJson[ delobjid ];
var geocount = getGeocount();
geocount = geocount - 1;
setGeocount(geocount);
$("#"+delobjid).remove();
// $("body").remove("'#"+delobjid+"'");
delobjid = selobjid = null;
// $("#"+delobjid).remove();
print();
};
pt.clear = function(){
print();
var rentJson = RentNumObj.rentJson;
for(var p in rentJson){
delete rentJson[p];
console.log("p:", p);
$("#"+p).remove();
}
setGeocount( 0 );
delobjid = selobjid = null;
print();
};
pt.sel = function(){
print();
var me = this;
// console.log( me );
// console.log("id : " + me.id);
delobjid = selobjid = me.id ;
rentJson = RentNumObj.rentJson;
console.log("rentJson[selobjid]:", rentJson[selobjid]);
print2();
print();
};
pt.save = function(){
print();
var tarobj = checkTarget("intext");
var geocount = getGeocount();
if(geocount > 0){
var tarval = tarobj[0].value;
if( !checkRentValLose() && tarval == "" ){
alert("未绑定租金值,请填写租金值!");
return false;
}
}
print();
};
pt.bindOnBlur = function(){
print();
var tarval = checkTarget("intext")[0].value;
if( tarval != "" && selobjid != null ){
var rentjson = RentNumObj.rentJson;
rentjson[selobjid] = tarval;
alert("租金值已经绑定!");
checkTarget("intext")[0].value = "";
delobjid = selobjid = null;
}
print();
};
window.RentNumObj = RentNumObj;
})(); $(function(){ console.log(RentNumObj); $("#btn_add").bind("click", RentNumObj.add);
$("#btn_del").bind("click", RentNumObj.del);
//$("#btn_sel").bind("click", RentNumObj.sel);
$("#btn_save").bind("click", RentNumObj.save);
$("#btn_clear").bind("click", RentNumObj.clear); $("#intext").bind("blur", RentNumObj.bindOnBlur);
});
</script>
</head>
<body>
<div class="main">
<div class="sub"><span class="btn"><input type="button" id="btn_add" value="Add"></span></div>
<div class="sub"><span class="btn"><input type="button" id="btn_del" value="Delete"></span></div>
<div class="sub"><span class="btn"><input type="button" id="btn_clear" value="Clear"></span></div>
<!--<div class="sub"><span class="btn"><input type="button" id="btn_sel" value="Select"></span></div>-->
<div class="sub"><span class="btn"><input type="button" id="btn_save" value="Save"></span></div> <div class="sub"><input type="text" id="intext"></div>
</div>
<div class="panel" id="panel" width="100px" height="500px" ></div>
<div class="panel" id="panel2" width="100px" height="500px" style="float:right;padding:50px;"></div>
<div>----------------------------</div>
</body>
</html>

这样写JS的方式对吗?的更多相关文章

  1. 不管你以后写不写JS,都应该学会这种思考方式

    昨天在网上看到了一篇文章说程序员写不过35这种说法,但事实上,确实并不能每个人都像我一样,在写JS中找到乐趣,就乐意写这东西直到50岁眼瞎为止. 那肯定有人要问,也许我不仅写JS写不到35,可能我连3 ...

  2. 如果使用引用方式引用了js后 则不能再本地写js 因为写了后不会有效果

    如果使用引用方式引用了js后 则不能再本地写js 因为写了后不会有效果

  3. FLASH CC 2015 CANVAS (二)html中写JS调用flash中的元件、函数、变量

    注意 此贴 为个人边“开荒”边写,所以不保证就是最佳做法,也难免有错误! 正式教程会在后续开始更新 当你导出第一个canvas后,你会在保存fla的文件夹里 (每个项目默认位置)看到 如下文件,(请先 ...

  4. cocos2dx手写js绑定C++

    这两天连续查阅了js绑定c++的非常多文章  , 有手动与自己主动两种方式 . 本来想用自己主动绑定的 , 可是NDK一直下载不下来.....就给算了 . 以下总结一下手动绑定的实现过程 : 一共三步 ...

  5. Java 10 的 10 个新特性,将彻底改变你写代码的方式!

    Java 9才发布几个月,很多玩意都没整明白,现在Java 10又快要来了.. 这时候我真尼玛想说:线上用的JDK 7 甚至JDK 6,JDK 8 还没用熟,JDK 9 才发布不久不知道啥玩意,JDK ...

  6. JS 引入方式 基本数据类型 运算符 控制语句 循环 异常

    一.JS引入方式 什么是JavaScript? JavaScript是运行在浏览器端的脚步语言,JavaScript主要解决的是前端与用户交互的问题,包括使用交互与数据交互,JavaScript是浏览 ...

  7. 000 在什么位置写js代码

    一:介绍 1.DOM 2.节点分类 节点及其类型: 1). 元素节点 2). 属性节点: 元素的属性, 可以直接通过属性的方式来操作. 3). 文本节点: 是元素节点的子节点, 其内容为文本. 二:J ...

  8. springMVC 引入静态资源Js的方式

    前两天项目出现了Js无法引入的情况,本篇博客先总结分析+批判自己犯的低级错,再说说几种访问静态资源的方式! 首先,由于在web.xml里面的servlet拦截匹配为<url-pattern> ...

  9. 在wxml中直接写js代码(wxs)

    我们在h5开发中,很多时候要在html中写到js代码,这个很容易实现.但是在微信小程序开发中,是不能直接在wxml中写js代码的,因此就有了wxs.在wxml中用wxs代码,有以下几种方式(在小程序文 ...

随机推荐

  1. Storm系列(二十)分区事务PartitionTransaction及示例

    在Storm中分区事务的处理,Spout端需要实现IPartitionedTransactionalSpout接口,用于对批次及偏移量的控制,而Bolt都必须实现IBatchBolt接口,通常继承至B ...

  2. devexpress中gridcontrol头部添加垂直线(右边框)

    winform开发,用devexpress中的gridcontrol控件,头部默认是3D样式,当客户希望像内容一样扁平化显示且需要添加垂直线(右边框)时恶梦开始了..经过一阵摸索发现可以这样解决: 1 ...

  3. 跟我一起写Makefile:MakeFile介绍

    makefile 介绍 make命令执行时,需要一个 makefile 文件,以告诉make命令如何去编译和链接程序. 首先,我们用一个示例来说明makefile的书写规则.以便给大家一个感性认识.这 ...

  4. jquery实时监听某个文本框的输入事件

    想给页面的的一个文本框添加监听事件 $(function(){ //页面加载完毕后触发事件 $("textarea[name='content']").bind('input pr ...

  5. WinForm Excel导入

     主要代码如下: 定义一个DataSet   存放Excel读取的数据 /// <summary> /// Excel 表中读取的数据 /// </summary> publi ...

  6. struts2的json-default和struts-default的区别

    http://www.cnblogs.com/lbangel/archive/2013/05/24/3096986.html struts2的json plugin可以实现struts2和json的完 ...

  7. 动态获取jar文件的路径

    下面专门封装了一个类来处理: import  java.io.File; /** * 获取打包后jar的路径信息 * @author Administrator *  2011-01-16 13:53 ...

  8. WinForm简单多国语言实现

    参考:http://minmin86121.blog.163.com/blog/static/4968115720119259151898/ http://www.cnblogs.com/hakuci ...

  9. 3 分钟学会调用 Apache Spark MLlib KMeans

    Apache Spark MLlib是Apache Spark体系中重要的一块拼图:提供了机器学习的模块.只是,眼下对此网上介绍的文章不是非常多.拿KMeans来说,网上有些文章提供了一些演示样例程序 ...

  10. 文件和目录之mkdir和rmdir函数

    用mkdir函数创建目录,用rmdir函数删除目录. #include <sys/stat.h> int mkdir( const char *pathname, mode_t mode ...