인터넷정보

input text용 updown 버튼

알 수 없는 사용자 2007. 10. 11. 11:17

//============================================================================
// input text용 updown 버튼
//============================================================================
function input_print_updown(this_s,v_min,v_max,step){
 //==========================
 // 초기화
 //==========================  
 if(this_s.type!='text'){return;}
 this_s.value = parseFloat(this_s.value);
 if(!isFinite(step))step=1;
 if(isFinite(v_max) && this_s.value>=v_max){this_s.value=v_max;}
 if(isFinite(v_min) && this_s.value<=v_min){this_s.value=v_min;}
 //==========================
 // SPAN에 출력후 textbox를 속에 넣는다
 //========================== if(!step) step=1;
 var span = document.createElement('span');
 //span.style.borderStyle='solid';
 if (this_s.nextSibling)
 this_s.parentNode.insertBefore(span,this_s.nextSibling);
 else this_s.parentNode.appendChild(span);
 
 span.appendChild(this_s);
 //==========================
 // 버튼 생성부
 //==========================
 var input_m = document.createElement('input');
 input_m.type='button';
 input_m.value='-';
 input_m.className = this_s.className;
 input_m.style.fontSize = this_s.style.fontSize;
 input_p = input_m.cloneNode(input_m);
 input_p.value='+';
 //==========================
 // 버튼 이벤트 생성부
 //==========================
 to =null;
 var to_clear = function(){ clearTimeout(to); }//타임아웃 클리어
 var m = function(){
  var t = parseFloat(this_s.value);
  if(isFinite(v_min) && t<=v_min){to_clear();return;}
  this_s.value=t-step;
 }
 var m_d = function(){
  m();to = setTimeout(m_d,200);
 }
 var p = function(){
  var t = parseFloat(this_s.value);
  if(isFinite(v_max) && t>=v_max){to_clear();return;}
  this_s.value=t+step;
 }
 var p_d = function(){
  p();to = setTimeout(p_d,200);
 }
 input_m.onmousedown = m_d;
 input_m.onmouseout = to_clear;
 input_m.onmouseup = to_clear;
 input_p.onmousedown = p_d;
 input_p.onmouseout = to_clear;
 input_p.onmouseup = to_clear;
 //==========================
 // 버튼을 붙인다.
 //==========================
 span.appendChild(input_m);
 span.appendChild(input_p);
}



<input name="test" type="text" id="test" value="20" size="5" maxlength="5" />
<script>input_print_updown(document.getElementById('test'),0,50);</script>

반응형