<!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>