2011-11-07 4 views
6

나는 정렬 가능한 여러 목록을 가지고 있으며 각 목록으로 요소를 드래그 할 수 있습니다.jQuery sortable selector ("id"대 "class")?

셋업은 다음과 같이 보입니다 :

<ul id="sortable1" class="connectedSortable"> 
<li>Item 1</li> 
<li>Item 2</li> 
<li>Item 3</li> 
</ul> 

<ul id="sortable2" class="connectedSortable"> 
<li>Item 1</li> 
<li>Item 2</li> 
<li>Item 3</li> 
</ul> 

자바 스크립트가 간단하고이

(JQuery와 웹 사이트에서 다음의 예)

<script> 
$(function() { 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: ".connectedSortable" 
    }).disableSelection(); 
}); 
</script> 

지금까지 그렇게 보이는 좋은 ...

질문 :

jQuery 선택기의 경우 두 개의 목록 ID 대신 ul 클래스를 사용할 수 있습니까 ??

뭔가 같은 :

<script> 
$(function() { 
    $(".connectedSortable").sortable({ 
     connectWith: ".connectedSortable" 
    }).disableSelection(); 
}); 
</script> 

이 올바른 것입니까?

내가 이것을 시도하고 작동 ...

...하지만 난이 jQuery를 웹 사이트 선택과 같은 목록 ID와 단지 클래스 이름을 모두와 예제를 제공 않는 이유 궁금해? 선택기로 클래스를 사용하면 호환성 문제가 발생할 수 있습니까?

선택기로 클래스 이름을 사용하면 장점은 내가 목록 ID를 미리 알 필요가 없으며 이론적으로 새로운 목록을 즉석에서 만들 수 있다는 것입니다.

모범 사례와 종류의 "오류 증명"은 무엇입니까?

고맙습니다.

답변

2

클래스로 선택하면 문제가 없으며 스크립트가 올바른 것입니다.

클래스별로 요소를 선택하는 동안 호환성 문제가 발생하지 않았습니다.

클래스 이름을 사용하면 일치시킬 모든 요소의 ID를 지정할 필요가 없다는 모험이 있습니다. 클래스가 다른 요소에서 잘못 사용 된 경우 의도 한 것보다 많은 요소를 일치시킬 수 있다는 단점이 있습니다.

ID로 요소를 지정할 때 의도 한 요소 만 선택했는지 확인해야합니다. 따라서 정확히 일치시킬 DOM 요소를 알고 자신의 ID를 아는 경우 유용 할 수 있습니다. 당신이 알아 차 렸던 것처럼, 당신이 즉석에서 요소를 생성한다면 이것은 불가능할 수 있습니다.

여러분의 경우 모범 사례는 클래스 이름을 사용하는 것입니다. CSS에서 일치하는 클래스 이름을 사용하지 마십시오. 서식을 담당하는 경우 사용자 (또는 팀의 다른 사용자)는 혼자 서식을 지정하기 위해 관련성이없는 다른 요소에서 제공 한 동작 변경 사항을 잊어 버릴 수 있습니다. 버그가 발생할 수 있습니다. 별도의 'behavioral'및 'presentation'클래스를 사용하고, CSS에서 프레젠테이션 클래스를 사용하고, jQuery에서 요소를 선택하기위한 동작 클래스를 사용하는 것이 좋습니다.

+0

고맙습니다. 이것은 나에게 목록을 다루는 방법에 대한 좋은 아이디어를 준다. – user1033406

+0

신난다, 고마워. – user1033406