sourcecode

jQuery로 선택 요소를 재설정하는 방법

copyscript 2023. 10. 16. 22:00
반응형

jQuery로 선택 요소를 재설정하는 방법

있습니다

<select id="baba">
<option>select something</option>
<option value="1">something 1</option>
<option value=2">something 2</option>
</select>

jQuery를 사용하여 가장 쉬운(쓰기가 적은) 방법은 무엇입니까?select그럼 첫번째 옵션이 선택된건가요?

이거 먹어봐요.이거면 돼요.$('#baba').prop('selectedIndex',0);

여기 http://jsfiddle.net/bibin_v/R4s3U/ 에서 확인하세요.

귀하의 경우(그리고 제가 본 대부분의 사용 사례), 필요한 것은 다음과 같습니다.

$("#baba").val("");

데모.

$('#baba option:first').prop('selected',true);

요즘에는 .prop (): http://api.jquery.com/prop/ 을 사용하는 것이 가장 좋습니다.

어떤 솔루션도 사용자에게 적합하지 않았다면 다음을 추가해 보십시오.

.trigger( "change" );

전과가 있는

$("#baba").val("").trigger( "change" );

아니면

$("#baba").val(false).trigger( "change" );

아니면

$("#baba option").prop("selected", false).trigger( "change" );

아니면

$('#baba').prop('selectedIndex',-1).trigger( "change" );

아니면

$('#baba option:first').prop('selected',true).trigger( "change" );
$('#baba').prop('selectedIndex',-1);

단일 선택 필드를 기본 옵션으로 재설정합니다.

<select id="name">
    <option>select something</option>
    <option value="1" >something 1</option>
    <option value="2" selected="selected" >Default option</option>
</select>
<script>
    $('name').val( $('name').find("option[selected]").val() );
</script>


또는 모든 양식 필드를 기본 옵션으로 재설정하려면:

<script>
    $('select').each( function() {
        $(this).val( $(this).find("option[selected]").val() );
    });
</script>

편집: 옛날 방식,

document.getElementById('baba').selectedIndex = 0;

아래를 시도해보면 당신의 경우에 적합할 것입니다.

$('#baba option:first').prop('selected', true);

데모

$('#baba option:first').attr('selected',true);

이 기능은 모든 유형의 선택(multiple, select, select2)에 대해 작동해야 합니다.

$.fn.Reset_List_To_Default_Value = function()
{
    $.each($(this), function(index, el) {
        var Founded = false;

        $(this).find('option').each(function(i, opt) {
            if(opt.defaultSelected){
                opt.selected = true;
                Founded = true;
            }
        });

        if(!Founded)
        {
            if($(this).attr('multiple'))
            {
                $(this).val([]);
            }
            else
            {
                $(this).val("");
            }
        }
        $(this).trigger('change');
    });
}

사용 방법은 다음과 같습니다.

$('select').Reset_List_To_Default_Value();

이렇게 하면 효과가 있으며 선택한 모든 항목에 적용됩니다.

$('#baba').val($(this).find('option:first').val());

내가 찾은 자바스크립트 솔루션 중 가장 좋은 것은 이것입니다.

elm.options[0].selected="selected";

첫 번째 옵션(필드가 숨겨져 있거나 다른 경우)을 사용하지 않으려면 다음 jQuery 코드로 충분합니다.

$(document).ready(function(){
    $('#but').click(function(){
        $('#baba').val(false);
    })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<select id="baba">
<option>select something</option>
<option value="1">something 1</option>
<option value=2">something 2</option>
</select>
    
    <input type="button" id="but" value="click">

저는 믿습니다.

$("select option:first-child").attr("selected", "selected");

이는 모든 옵션의 선택을 취소한다는 점에서 다른 답변과는 조금 다르게 작동합니다.

$("#baba option").prop("selected", false);

(https://stackoverflow.com/a/11098981/1048376) 에서 빌렸습니다.

이것은 저에게 효과가 있습니다.

$('#DropList option:first').prop('selected',true).trigger("change");

언급URL : https://stackoverflow.com/questions/10502093/how-to-reset-a-select-element-with-jquery

반응형