반응형
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR" />
<script type="text/javascript">
function cancelEvent(e) {
e = e ? e : window.event;
if (e.stopPropagation)
e.stopPropagation();
if (e.preventDefault)
e.preventDefault();
e.cancelBubble = true;
e.cancel = true;
e.returnValue = false;
return false;
}
function addEvent(type, el, handler, bubbling) {
if (document.addEventListener) {
document.addEventListener(type, handler, bubbling);
} else if (document.attachEvent) {
el.setCapture();
el.attachEvent("on" + type, handler);
}
}
function removeEvent(type, el, handler, bubbling) {
if (document.removeEventListener) {
document.removeEventListener(type, handler, bubbling);
} else if (document.detachEvent) {
el.detachEvent("on" + type, handler);
el.releaseCapture();
}
}
var SpinBox = function(A, B, C) {
//Constructor
this.textBox = document.getElementById(A);
this.btnUp = document.getElementById(B);
this.btnDown = document.getElementById(C);
this.bindEvent();
}
SpinBox.prototype.initial = function(e) {
this.textBox.focus();
this.textBox.value = "123";
this.textBox.blur();
}
SpinBox.prototype.onBtnUpClick = function(e) {
var val = this.textBox.value;
this.textBox.value = parseInt(val) + 1;
}
SpinBox.prototype.onBtnDownClick = function(e) {
var val = this.textBox.value;
this.textBox.value = parseInt(val) - 1;
}
if (!Function.prototype.bind) {
Function.prototype.bind = function(oThis) {
if (typeof this !== "function") // closest thing possible to the ECMAScript 5 internal IsCallable function
throw new TypeError(
"Function.prototype.bind - what is trying to be fBound is not callable");
var aArgs = Array.prototype.slice.call(arguments, 1), fToBind = this, fNOP = function() {
}, fBound = function() {
return fToBind.apply(this instanceof fNOP ? this : oThis
|| window, aArgs.concat(Array.prototype.slice
.call(arguments)));
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
SpinBox.prototype.bindEvent = function() {
this.btnUp.onclick = this.onBtnUpClick.bind(this);
var self = this;
this.onBtnUpClick.apply(self, arguments);
/*
this.btnUp.onclick = function() {
var val = self.textBox.value;
self.textBox.value = parseInt(val) + 1;
}*/
this.btnDown.onclick = this.onBtnDownClick.bind(this);
this.btnDown.onclick = function() {
var val = self.textBox.value;
self.textBox.value = parseInt(val) - 1;
}
}
window.onload = setupEvents;
function setupEvents() {
var s = new SpinBox("text1", "btnUp", "btnDown");
s.initial();
}
</script>
</head>
<body>
<input type="text" id="text1" />
<button id="btnUp">Up</button>
<button id="btnDown">Down</button>
</body>
</html>
반응형