문제

드롭 다운 메뉴를 다시 채우려고합니다. MyList를 검색하기 위해 Ajax 호출을하고 있습니다. 새 목록이 있으면 선택 요소에서 모든 옵션을 제거하고 새 값 (약 100 옵션)을 삽입합니다. 이것은 IE와 Firefox의 이후 버전에서 훌륭하게 작동합니다. 새로 고침은 거의 즉각적입니다. 그러나 IE6에서는 이러한 작업이 브라우저가 실제로 느려집니다. 옵션이 제거됨에 따라 드롭 다운 상자는 거의 애니메이션이되어 몇 초 동안 계속됩니다. 이전 목록을 새 목록과 비교하고 변경된 항목 만 제거/추가하는 것 외에이 속도를 높이는 방법이 있습니까?

$("#myselect").children.remove();

$.each(myList, function(i, val) {
   $("<option>").attr("value", val.myID)
                .text(val.myText)
                .appendTo("#myselect");
});
도움이 되었습니까?

해결책

새 요소를 만들어 전환하면 어떻게됩니까?

var newSelect = $("<select></select>");
$.each(myList, function(i, val) {
    $("<option>").attr("value", val.myID)
                 .text(val.myText)
                 .appendTo(newSelect);
});
$("#myselect").replaceWith(newSelect);

다른 팁

코드가 훨씬 더 좋지만 너무 느리면 직접 경로로 가십시오 (jQuery를 사용하기 전에 과거에 해냈으며 IE6을 포함한 모든 브라우저에서 즉각적이었습니다). HTML을 제거하여 선택에서 모든 어린이를 제거하십시오.

$("#myselect").html('');

각 옵션에 대한 HTML을 만들도록 루프를 수정하고 사용하여 SELECT에 삽입하십시오.

$('#myselect').html(optionsHTML); 

성능에 따라이 솔루션과 Karim79의 솔루션 사이의 중간지면을 시도 할 수 있습니다 (예 : html ()가있는 옵션을 제거하고 일반 HTML을 만드는 대신 배열을 사용하여 추가).

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top