사용자 정의 속성 문제에 대한 해결 방법 한 가지

사용자 정의 속성 문제에 대한 해결 방법 한 가지 정보

사용자 정의 속성 문제에 대한 해결 방법 한 가지

본문

안녕하세요.
사용자 정의 속성에 대해서 청춘불안정님의 코멘트를 참고하여 작성해보았습니다.
이런 방법도 있었네요.

일단 내용은 저도 잘 모르니 생략합니다.
그래도, 간단히 말씀드리자면 <input id="mb_name" required /> 이런 식으로 되잖아요.
required가 있으면 반드시 입력해야 한다는 뜻이고, 그누보드의 트레이드마크가 되버린 하늘색 삼각형이 인풋창 우상단에 위치하는 것 같았습니다. 그밖에 한글이나 영어 숫자만 입력, 최소 입력 글자수, 공백이 없어야함 등등 사용자 정의 속성을 지정할 수 있습니다.
헌데, 웹표준 검사기에서는 이런 사용자 정의 태그를 에러처리 하므로, 자바스크립트로 우회하여 지정하는 방법을 사용하면 되더군요.

일단, 함수 이름 작명 센스 제로라 그냥 넘어가지요... -_-
아래와 같은 함수를 만듭니다. js 파일로 만들어서 인클루드 하면 편하겠지요.
저는 user.js 이런 파일을 만들어서 head.sub.php 처음 부분에서 불러오도록 했습니다.

    function user_att(id, item) {
        for(var i=0; i<item.length; i+=2)
        {
            document.getElementById(id).setAttribute(item[i], item[i+1]);
        }
    }

태그의 아이디(id)와 사용자 정의 속성 배열(item)을 인자로 받습니다.

사용은 아래와 같이 하면 됩니다.
하단부에 자바스크립트 하나 만들어서 넣어주면 되겠지요.

user_att("mb_name",new Array("itemname","이름","required","required","nospace","nospace","hangul","hangul","minlengh",2));

user_att("mb_jumin",new Array("itemname","주민등록번호","required","required","numeric","numeric","minlengh",13));

※ 부가 설명

아래는 회원 가입전에 약관 동의 할때 나오는 이름 입력 창입니다.

<input type="text" id="mb_name" itemname="이름" required minlength="2" nospace hangul class="ed" />

빨간색이 사용자 정의 태그 부분입니다. 이 빨간색 부분을 배열로 넘기면 됩니다.
단, 배열로 넘기실때, required나 nospace와 같은 것은 결론 적으로 required="required" 이런 형태가 되도록 2번 써주면 됩니다.
본 팁을 적용하시고, 인풋창의 사용자 정의 속성(빨간색 부분)은 지우면 됩니다.
그리고, 진하게 표시된 부분 처럼 인풋창의 name을 id로 바꿔주셔야 합니다.

아래처럼 함수가 작성됩니다.

user_att("mb_name",new Array("itemname","이름","required","required","nospace","nospace","hangul","hangul","minlengh",2));

ps. 하늘색 상자 안의 코드는 모두 자바스크립트 코드입니다.

http://kimchulho.com/g4/bbs/register.php
이쪽에 와보시면 위 내용을 적용하여 기능이 정상 작동하고, 웹표준 검사도 통과하는 것을 볼 수 있습니다. 좌하단의 노란색 w3c/xhtml 버튼 누르면 웹표준 검사기로 이동하며, 녹색이 나오면 웹표준 문법에 이상이 없다는 것입니다.

다른 것들은 나중에 손봐야겠네요.
내일 웹프로그래밍 시험이 있어서 프린트 좀 보다 자야겠습니다.