IE8에서 radio button click이벤트 안될때!

진행중이던 프로젝트 하나가 IE8에 맞춰서 작업되어 있었어요.
그런데 IE7에 맞추어달라는 이벤트가 있어서 확인하다 보니.
라디오버튼에 click이벤트가 작동이 안되더라구요!

그래서 해결했던 방법!!

$("label").click(function(){
         if ($(this).attr("for") != ""){
          	$("#" + $(this).attr("for")).click();	
          }
});

이렇게 코드를 추가했더니 IE7,IE8 모두 다 작동이 되었어요!

웹접근성 준수 markup validation 관련 체크리스트

form 태그 사용시 action 속성 추가
액션 없이 자바스크립트로 우회적으로 submit 하는 경우라도

<form action="">

과 같이 빈값으로 속성을 넣어주세요.

단독 태그의 닫는 태그 사용
단독 태그의 경우

<input id="" name="" type="hidden" />
<img />

과 같이 ‘/’ 로 닫아주세요.
input, br, img 태그가 해당됩니다. 개발쪽에선 주로 input 태그나, 동적으로 써주는 img,br태그 확인해주시면 되겠습니다.

속성의 소문자 처리
doctype xhtml에서는 엘리먼트의 모든 속성값이 소문자입니다.
개발파트에서는 주로 onclick 같은 이벤트 핸들러가 해당사항이 되겠습니다. onClick, onChage -> onclick, onchange
disable, readonly, checked 등 어트리뷰트는 속성=”값” 형태로 작성되어야 합니다.

ex) <input readonly="readonly" type="text" />
      <input readonly="readonly" type="text" />

textarea의 cols, rows 속성 추가
이 부분은 퍼블리싱단계에서 일부 누락이 있던듯 합니다. 차후 검수시 추가할 예정입니다.
작업시 발견하실 경우 아래와 같이 속성 추가 부탁드립니다. 빈 값으로 추가하시면 됩니다.

ex) <textarea cols="" rows=""></textarea>

html,jsp페이지 내의 자바스크립트 선언시 올바른 타입 선언 및 cdata 처리
페이지 내에서 인라인으로 자바스크립트 선언시 아래와 같이 타입을 선언하고 cdata로 감싸주세요.

<script type="text/javascript">
// <![CDATA[

// ]]>
</script>

추가적으로 anchor 태그(<a>)에 onclick 이벤트를 직접 걸 경우 hash값이 url에 들어가지 않게 하기 위해 false를 리턴해주시기 바랍니다.

ex) <a href="#">링크</a>

말 줄이기 ellipsis

한줄 글자수 제한

.text {
    width:100px; /* %도 가능함 */
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

– Block레벨 테그에서만 적용이 됩니다.
– overflow:hidden : 넓이가 70px를 넒어서는 내용에 대해서는 보이지 않게 처리함
– text-overflow:ellipsis : 글자가 넓이 70px를 넘을 경우 생략부호를 표시함
– white-space:nowrap : 공백문자가 있는 경우 줄바꿈하지 않고 한줄로 나오게 처리함 (\A로 줄바꿈가능)

여러줄 글자수 제한

.text {
      display: -webkit-box;
      display: -ms-flexbox;
      display: box;
      margin-top:1px;
      max-height:80px;
      overflow:hidden;
      vertical-align:top;
      text-overflow: ellipsis;
      word-break:break-all;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:3
  }