如果重新加載頁面后仍選擇其他選項，則顯示隱藏的文本框

Question

我有一個JavaScript代碼

使用Javascript

<script type="text/javascript">
    $(document).ready(function() {
    $("label[for='id_other']").hide();
    $("#id_other").hide();
    $('#id_subsector').change(function() {
        $("label[for='id_other']").show();
        $("#id_other").show();
        if ($('#id_subsector').val() == 'Others') {
            $("label[for='id_other']").css('display', 'block');
            $("#id_other").css('display', 'block');
        } else {
            $("label[for='id_other']").css('display', 'none');
            $("#id_other").css('display', 'none');
        }
    });
});
</script>

page.html中

<label class="required" for="id_subsector">Sub-sector:</label> <select id="id_subsector" maxlength="50" name="subsector">
<option value="Auto ancillary">Auto ancillary</option>
<option value="Retail">Retail</option>
<option value="Life Sciences">Life Sciences</option>
<option value="Healthcare">Healthcare</option>
<option value="Logistics">Logistics</option>
<option value="Food &amp; Agriculture">Food &amp; Agriculture</option>
<option value="Printing">Printing</option>
<option value="Gems &amp; Jewellery">Gems &amp; Jewellery</option>
<option value="Light Engineering">Light Engineering</option>
<option value="Chemicals &amp; Dyes">Chemicals &amp; Dyes</option>
<option value="Motels &amp; Restaurants">Motels &amp; Restaurants</option>
<option value="Luxury &amp; Lifestyle">Luxury &amp; Lifestyle</option>
<option value="Power">Power</option>
<option value="Electrical and Electronic Goods">Electrical and Electronic Goods</option>
<option value="Education">Education</option>
<option value="Import/Export">Import/Export</option>
<option value="IT/ITES">IT/ITES</option>
<option value="Others">Others</option>
</select>

<label class="required" for="id_other">Others:</label>
<input id="id_other" maxlength="50" name="other" type="text">

現在，這就像單擊其他按鈕一樣，將顯示文本框，我可以輸入數據。 如必填字段，當我重新加載頁面時，它消失並顯示錯誤。

如果即使重新加載后也選擇了其他框，如何顯示文本框？/

欣賞答案

Answer 1

用它。 這對您有幫助。 我正在使用localStorage，並且您選擇了其他選項加載頁面后顯示文本框

$(document).ready(function() {
    $("label[for='id_other']").hide();
    $("#id_other").hide();
    $('#id_subsector').change(function(){
    $("label[for='id_other']").show();
    $("#id_other").show();
                              localStorage.setItem("value_option",$('#id_subsector').val());        
    if($('#id_subsector').val() == 'Others')
        {
           $("label[for='id_other']").css('display', 'block');
           $("#id_other").css('display', 'block');
        }
    else
       {
           $("label[for='id_other']").css('display', 'none');
           $("#id_other").css('display', 'none');
       }
    });
    //load textbox if others
    var a=  localStorage.getItem("value_option");
    if(a!=null){
        $("#id_subsector").val(a);
        if(a == 'Others')
        {
           $("label[for='id_other']").css('display', 'block');
           $("#id_other").css('display', 'block');
        }
    }

});

點擊演示