html javascript radio handler 예제
2017-11-07
썩 좋은 예제는 아님...
전역 namespace 선언하고
엘레먼트 구분하고
사용할 엘레먼트 별 이벤트 만들어 넣고
핸들러 영역 구분하고
사용할 핸들러 만들어 넣음. 끝..
jquery 코드 부분은 DOM 기본 셀렉터로 바꾸는게 더 좋다고 생각하지만 귀찮으니까 이 정도로 정리..
멜론 티켓 때 코드를 안 옮겨 놔서 한 번 써봄...
toggle, on 등에 각각 shield 패턴이 들어가야 제대로 된 형태라고 볼 수 있을듯...
setProp 도 역시 jQuery 랩핑이라 그냥 그럼.... .prop 대신 쓸 수 있게 만들면 좋을듯..
var dom = {};
dom.ele = {};
dom.ele.radio = {};
dom.handler = {};
dom.handler.setProp = function(eleId,prop,value){
$dom[eleId].prop(prop,value);
//document.getElementById(eleId)[prop] = value;
};
dom.handler.toggle = function(eleId,prop){
//var value = $dom[eleId].prop(prop) ? false : true;
var value = document.getElementById(eleId)[prop] ? false : true;
dom.handler.setProp(eleId,prop,value);
};
dom.ele.radio.toggle = function(eleId){
var prop = 'checked';
dom.handler.toggle(eleId,prop);
};
dom.ele.radio.on = function(eleId){
var prop = 'checked';
dom.handler.setProp(eleId,prop,true);
};
var $dom = {};
$dom.clazz = {};
var initDom = function() {
$dom.btn_sms_y = $('#btn_sms_y');
$dom.btn_sms_n = $('#btn_sms_n');
$dom.btn_email_y = $('#btn_email_y');
$dom.btn_email_n = $('#btn_email_n');
};
function init_agree(){
var agreeText ="";
if(smsBool){
dom.ele.radio.on('btn_sms_y');
//$('#btn_sms_y').prop( 'checked', true );
}else{
dom.ele.radio.on('btn_sms_n');
//$('#btn_sms_n').prop( 'checked', true );
}
if(emailBool){
dom.ele.radio.on('btn_email_y');
//$('#btn_email_y').prop( 'checked', true );
}else{
dom.ele.radio.on('btn_email_n');
//$('#btn_email_n').prop( 'checked', true );
}
}