[javascript] 선택 상자의 모든 옵션을 제거한 다음 하나의 옵션을 추가하고 jQuery로 선택하는 방법은 무엇입니까?

JAVASCRIPT / 글쓴이

핵심 jQuery를 사용하여 선택 상자의 모든 옵션을 제거한 다음 하나의 옵션을 추가하고 선택하는 방법은 무엇입니까?

내 선택 상자는 다음과 같습니다.

<Select id="mySelect" size="9"> </Select>

편집 : 다음 코드는 체인에 도움이되었습니다. 그러나 (Internet Explorer에서) .val('whatever')추가 된 옵션을 선택하지 않았습니다. ( .append와 에서 모두 동일한 ‘값’을 사용했습니다 .val.)

$('#mySelect').find('option').remove().end()
.append('<option value="whatever">text</option>').val('whatever');

편집 :이 코드를 모방하려고 페이지 / 양식이 재설정 될 때마다 다음 코드를 사용합니다. 이 선택 상자는 일련의 단일 선택 단추로 채워집니다. .focus()더 가까이 있지만 옵션은 에서처럼 선택되지 않았습니다 .selected= "true". 기존 코드에 아무런 문제가 없습니다. jQuery를 배우려고합니다.

var mySelect = document.getElementById('mySelect');
mySelect.options.length = 0;
mySelect.options[0] = new Option ("Foo (only choice)", "Foo");
mySelect.options[0].selected="true";

편집 : 선택한 답변이 내가 필요한 것에 가깝습니다. 이것은 나를 위해 일했다 :

$('#mySelect').children().remove().end()
.append('<option selected value="whatever">text</option>') ;

그러나 두 대답 모두 저의 최종 해결책으로 이끌었습니다.

답변

$('#mySelect')
    .find('option')
    .remove()
    .end()
    .append('<option value="whatever">text</option>')
    .val('whatever')
;

답변

$('#mySelect')
    .empty()
    .append('<option selected="selected" value="whatever">text</option>')
;

답변

왜 일반 자바 스크립트를 사용하지 않습니까?

document.getElementById("selectID").options.length = 0;

답변

첫 번째 옵션 (일반적으로 ‘항목을 선택하십시오’옵션)을 제외한 모든 옵션을 선택에서 제거하는 것이 목표 인 경우 다음을 사용할 수 있습니다.

$('#mySelect').find('option:not(:first)').remove();

답변

위의 jQuery 메소드를 사용 하면 DOM 에서 선택 이 지워지지 만 화면에는 표시되지 않는 IE7 (IE6에서는 잘 작동 함)에 버그가있었습니다 . IE Developer Toolbar를 사용하여 선택 항목이 지워지고 새 항목이 있음을 확인할 수 있었지만 시각적으로 선택하면 여전히 선택할 수 없었지만 이전 항목이 표시되었습니다.

해결 방법은 jQuery 대신 표준 DOM 메소드 / 프로퍼티 (포스터 원본과 동일)를 사용하여 지우는 것입니다. 여전히 jQuery를 사용하여 옵션을 추가했습니다.

$('#mySelect')[0].options.length = 0;

답변

어쨌든 기본적으로 선택되므로 “하나를 추가하고 선택하십시오”라는 말의 의미를 정확히 모릅니다. 그러나 둘 이상을 추가하는 경우 더 의미가 있습니다. 어때요?

$('select').children().remove();
$('select').append('<option id="foo">foo</option>');
$('#foo').focus();

“편집”에 대한 응답 : “이 선택 상자는 라디오 단추 세트로 채워져 있습니다”가 무슨 뜻인지 알 수 있습니까? <select>요소는 (법적으로) 포함 할 수 없습니다 <input type="radio">요소를.

답변

$('#mySelect')
    .empty()
    .append('<option value="whatever">text</option>')
    .find('option:first')
    .attr("selected","selected")
;