如果在重新加载页面后选择了其他文本框,则显示隐藏文本框

时间:2015-02-13 12:38:42

标签: javascript jquery html

我有一个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">

现在这就像我点击其他人一样,文本框会显示,我可以输入数据。由于它是必填字段,当我重新加载页面时,它会消失并显示错误..

如果重新加载后仍然选择了其他文本框,如何显示文本框?/

赞赏答案

1 个答案:

答案 0 :(得分:0)

使用它。这对你有帮助。我正在使用 localStorage ,您在加载页面后选择了其他选项show textbox

$(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');
        }
    }

});

Click To Demo