jQuery로 jquery가 선택한 선택 옵션을 재설정하려면 어떻게 해야 합니까?

jQuery로 jquery가 선택한 선택 옵션을 재설정하려면 어떻게 해야 합니까?

저는 여러 가지를 시도해 보았는데 아무 것도 안 되는 것 같습니다.

저는 jQuery와 Chosen 플러그인을 사용하고 있습니다.

시도해 본 방법:

var select = jQuery('#autoship_option');

select.val(jQuery('options:first', select).val());

jQuery('#autoship_option').val('');

jQuery('#autoship_option').text('');

jQuery('#autoship_option').empty('');

jQuery("#autoship_option option[value='']").attr('selected', true);

선택한 후에는 항상 Active Authip 옵션이 표시됩니다.선택을 취소할 수가 없는 것 같습니다.

다음은 선택 상자입니다.

<select id="autoship_option" data-placeholder="Choose Option..." 
style="width: 175px;" class="chzn-select">
    <option value=""></option>
    <option value="active">Active Autoship</option>
</select>

Chosen에 익숙하고 한 가지 옵션으로 선택 상자를 지울 수 있는 사람?(향후에는 더 많은 옵션이 제공될 것입니다.

설정select빈 문자열에 대한 요소 값이 올바른 방법입니다.그러나 이는 루트만 업데이트합니다.select요소. 정의 customchosen다라는 을 알지 못합니다.select업데이트되었습니다.

chosentselect되었습니다를 . 트리거해야 합니다.chosen:updated:

$('#autoship_option').val('').trigger('chosen:updated');

또는 첫번째 옵션이 빈 문자열인지 확실하지 않은 경우 다음을 사용합니다.

$('#autoship_option')
    .find('option:first-child').prop('selected', true)
    .end().trigger('chosen:updated');

여기서 설명서를 읽으십시오(선택한 항목을 동적으로 업데이트).

---

추신. Choosen의 이전 버전은 약간 다른 이벤트를 사용합니다.

$('#autoship_option').val('').trigger('liszt:updated');

첫 번째 옵션은 다음과 같습니다. http://jsfiddle.net/sFCg3/

jQuery('#autoship_option').val('');

해야 합니다.clickr의readyjsfiddle.

또한 옵션 태그에 값 속성이 항상 있는지 확인합니다.그렇지 않은 경우 일부 브라우저는 항상 빈 상태로 반환됩니다.val().

:
Choosen로,다에

$("#autoship_option").trigger("liszt:updated");

인터페이스를 업데이트하기 위해 값을 변경한 후.

http://harvesthq.github.com/chosen/

업데이트된 선택 상자를 Latest Choosen JS로 다시 로드합니다.

$("#form_field").trigger("chosen:updated");

http://harvesthq.github.io/chosen/

선택한 드롭다운을 Ajax와 함께 새로 로드된 선택 상자로 업데이트합니다.

시도해 보기:

$("#autoship_option option[selected]").removeAttr("selected");

나는 이것을(를)

$('idSelect').val([]);

IE, 사파리 및 파이어폭스에서 테스트됨

chosen을 사용한 jquery 를 사용합니다

$('#dropdown_id').empty().append($('< option>'))

dropdown_id.chosen().trigger("chosen:updated")

chosen:updated윌lre-build업데이트된 내용을 기반으로 자체적으로 작업할 수 있습니다.

이것은 찾는 것보다 더 효과적입니다.

$('select').children('option').first().prop('selected', true)
$('select').trigger("chosen:updated");

var config = {
      '.chosen-select'           : {},
      '.chosen-select-deselect'  : {allow_single_deselect:true},
      '.chosen-select-no-single' : {disable_search_threshold:10},
      '.chosen-select-no-results': {no_results_text:'Oops, nothing found!'},
      '.chosen-select-width'     : {width:"95%"}
    }
    for (var selector in config) {
      $(selector).chosen(config[selector]);
    }

하고 합니다를 합니다.class='chosen-select-deselect'을 선택 하고 빈 값으로

또는 모든 콤보에서 옵션 선택을 취소하고 싶다면 아래와 같이 config를 적용합니다.

var config = {
  '.chosen-select'           : {allow_single_deselect:true},//Remove if you do not need X button in combo
  '.chosen-select-deselect'  : {allow_single_deselect:true},
  '.chosen-select-no-single' : {disable_search_threshold:10},
  '.chosen-select-no-results': {no_results_text:'Oops, nothing found!'},
  '.chosen-select-width'     : {width:"95%"}
}
for (var selector in config) {
  $(selector).chosen(config[selector]);
}

$('#autoship_option').val('').trigger('liszt:updated');

을 합니다(으)로합니다.''.

https://raw.github.com/harvesthq/chosen/master/chosen/chosen.jquery.min.js 에서 선택한 업데이트된 jQuery와 함께 사용해야 합니다.

나는 하루를 꼬박 보내면서 마지막엔jquery.min와는 다릅니다.chosen.jquery.min

jQuery("#autoship_option option:first").attr('selected', true);

선택한 이전 버전에 적용되는지 확실하지 않지만 현재 버전(v1.4.1)에서는 옵션이 있습니다.$('#autoship_option').chosen({ allow_single_deselect:true });선택한 이름 옆에 'x' 아이콘이 추가됩니다.'x'를 사용하여 'select' 필드를 지웁니다.

PS: 아이콘이 보이도록 selected.css에 따라 올바른 위치에 'selected-prite.png'가 있는지 확인합니다.

크롬 버전 49에서

당신은 항상 이 코드가 필요합니다.

$("select option:first").prop('selected', true)

선택 항목에 새 값을 할당해야 한다고 생각하기 때문에 선택 항목을 지우려면 값이 = ""인 선택 항목에 할당해야 할 것입니다.빈 문자열 so.val('')에 값을 할당하면 얻을 수 있을 것 같습니다.

HTML:

<select id="autoship_option" data-placeholder="Choose Option..." 
        style="width: 175px;" class="chzn-select">
    <option value=""></option>
    <option value="active">Active Autoship</option>
</select>
<button id="rs">Click to reset</button>

JS:

$('#rs').on('click', function(){
    $('autoship_option').find('option:selected').removeAttr('selected');
});

Fiddle: http://jsfiddle.net/Z8nE8/

재설정(비어) 드롭다운을 시도할 수 있습니다.

 $("#autoship_option").click(function(){
            $('#autoship_option').empty(); //remove all child nodes
            var newOption = $('<option value=""></option>');
            $('#autoship_option').append(newOption);
            $('#autoship_option').trigger("chosen:updated");
        });

새 Chosen 라이브러리에서 목록을 사용하지 않습니다.다음을 사용했습니다.

document.getElementById('autoship_option').selectedIndex = 0;
$("#autoship_option").trigger("chosen:updated");

값에 관계없이 첫 번째 옵션을 선택해야 하는 경우(첫 번째 옵션 값이 비어 있지 않은 경우도 있음) 다음을 사용합니다.

$('#autoship_option').val($('#autoship_option option:first-child').val()).trigger("liszt:updated");

첫 번째 옵션의 값을 가져와 선택된 것으로 설정한 다음 Chosen에서 업데이트를 트리거합니다.따라서 목록의 첫번째 옵션으로 재설정하는 것처럼 작동합니다.

정확히 저도 같은 요구사항을 가지고 있었습니다.그러나 단순히 jquery로 빈 문자열을 설정하여 드롭다운 목록을 재설정하는 것은 작동하지 않습니다.업데이트도 트리거해야 합니다.

Html:
<select class='chosen-control'>
<option>1<option>
<option>2<option>
<option>3<option>
</select>

Jquery:
$('.chosen-control').val('').trigger('liszt:updated');

사용 중인 선택한 컨트롤의 버전에 따라 아래 구문을 사용해야 할 수도 있습니다.

$('.chosen-control').val('').trigger("chosen:updated");

참조:재설정 방법Jquery choose select 옵션

jQuery('.chosen-processed').find('.search-choice-close').click();

다음과 같은 간단한 트리거 추가 변경 사항:

$('#selectId').val('').trigger('change');

위의 해결책들을 통해, 저는 아무것도 효과가 없었습니다.작동했습니다.

$('#client_filter').html(' '); //this worked

왜 그럴까요? :)

$.ajax({ 
        type: 'POST', 
        url: xyz_ajax,
        dataType: "json",
        data : { csrfmiddlewaretoken: csrftoken,
                instancess : selected_instances }, 
        success: function(response) { 
            //clear the client DD       
            $('#client_filter').val('').trigger('change') ; //not working
            $('#client_filter').val('').trigger('chosen:updated') ; //not working
            $('#client_filter').val('').trigger('liszt:updated') ; //not working
             $('#client_filter').html(' '); //this worked
             jQuery.each(response, function(index, item) {
                  $('#client_filter').append('<option value="'+item.id+'">' + item.text + '</option>');
                });                 
           $('#client_filter').trigger("chosen:updated");
        }
      });
     } 

드롭다운 인덱스 키를 알고 있는 경우 드롭다운에서 동적으로 추가할 수 있습니다.

$('select').find('option:nth-child(5)')
.prop('selected', true).end()
.trigger('chosen:updated');

언급URL : https://stackoverflow.com/questions/11365212/how-do-i-reset-a-jquery-chosen-select-option-with-jquery