드롭 다운 옵션 제거 성능 문제

Question

드롭 다운 목록에서 수백 가지 옵션을 제거하는 가장 빠른 방법을 알아야합니다.

지금 Firefox는 제 2의 드롭 다운 동적 목록을 업데이트하는 데 정말로 느립니다. 크롬은 스크립트를 확인하고있다하지만 난 내 제거 속도를 필요가 산들 바람 다시 채우기

<select id="myDropDown" name="myDropDown"> 
<option value=1>1</option> 
<option value=2>2</option> 
<option value=3>3</option> 
<option value=4>4</option> 
<option value=5>5</option> 
... all the way to let's say 500 
</select> 

합니다. 나는 <option></option> 필드를 생성하는 json 파서를 가지고있다. 내가 해봤

:

.remove() 
.children().remove() 
.empty() 

그들은 모든 옵션의 수백의 제거에 같은 부진 있습니다. 내가 빠진 것이 있습니까?

Answer 1

루핑 해 보셨습니까?

$('#myDropDown option').each(function(i, option){ $(option).remove(); }); 

i의 값을 추적하여 지정할 수 있습니다.

Answer 2

흥미로운 질문입니다. 난 당신이 채울 수있는 값의 배열을 가질 수있다 생각의이 values을 가정 해 봅시다 : 나는 옵션

$("#someOption").hide(); 

편집 숨기 당신이 정말 빨리하려는 경우, 당신은/보여 단지 수 있다고 생각합니다. 옵션을 먼저 살펴보고 values 배열에있는 경우 각 옵션을 확인하면 속도가 빨라집니다 (그 반대의 경우는 느려질 것입니다). 따라서 :

var values = [...]; //Array with values that must 'exist' in the dropdown 
$("#select1 option").each(function(i, option){ 
    option.style.display = ($.inArray(option.value, values) >= 0 ? 'block' : 'none'); 
}); 

성능 향상을 위해 루프 내부의 jquery 선택기가 사용되지 않도록주의하십시오. 배열에서 검색하는 것이 dom에서 특정 속성 (이 경우에는 value)을 가진 요소 (이 경우에는 옵션)를 검색하는 것보다 훨씬 빠르기 때문에 먼저 배열 (및 내부의 옵션)을 탐색하지 않습니다.

희망이 도움이됩니다. 건배

Answer 3

문제는 jQuery가 물건을 제거 할 때 정리하려고 시도 할 수 있습니다. 자세한 내용은 .empty() ("메모리 누출을 방지하려면 ..."으로 시작)을 참조하십시오. 당신이이 상황에서 문제가 아니라고 생각하면

후

$("#someOption").text("");

당신이 필요로하는 쇠망 할 수있다.

Answer 4

$("#myDropDown").find("option").remove();