2013-03-25 3 views
1

jQuery로 "즉석에서"확인란과 레이블을 작성하면 기능을 잘 수행합니다 (즉, 레이블을 클릭하면 확인란이 선택됩니다). 브라우저가 레이블에 지정하는 기본 시각적 모양은 즉석에서 작성된 레이블에 할당 된 기본 시각적 모양과 동일하지 않습니다.즉시 작성되는 선택란 및 레이블

[x] normal label 
[x]label created on the fly 

차이점은 레이블과 확인란 사이의 공백 (여백)입니다.

여기에서 무슨 일이 일어나고 있는지 아이디어가 있습니까?

즉석에서 체크 박스/라벨 만들기위한 코드는 다음

<input type="checkbox" id="baz"/><label for="baz">quz</label> 
:

$('<input type="checkbox" id="foo"/><label for="foo">bar</label>') 

체크 박스/라벨 생성을위한 코드가없는 -에 - 더 - 플라이 다음과 같다

+1

그런 종류의 질문을 게시 할 때 실시간 데모를 시도해보십시오. 이것은 [주어진 코드] (http://jsfiddle.net/W4y6t/)를 가지고있는 비 재현자입니다. –

+3

입력과 레이블 사이에 공백이 없습니까? 또한 요소에 영향을 줄 수있는 CSS가 있는지 검사기를 사용하십시오. – Musa

+0

브라우저 개발자 도구로 html 요소를 검사하여 무슨 일이 일어나는지 확인하고 요소 내용과 적용된 스타일을 확인하십시오. –

답변

1

이는 무슨 일이 일어 났는지입니다 : http://jsfiddle.net/kSjJZ/

<body> 
    <ul id="bla"> 
     <li> 
      <input type="checkbox" id="baz"/><label for="baz">quz</label> 
     </li> 
     <li> 
      <input type="checkbox" id="foo"/> 
      <label for="foo">quz</label> 
     </li> 
    </ul> 
</body> 

기본적으로이 두 태그 (입력 및 레이블)가 \ r \ n으로 분리되어있는 경우 공백을 해석합니다.

+0

그래서 당신은 당신의 대답을 찾았습니다. – Sangeeta