JavaScript显示/隐藏下拉onchange函数，需要记住表单提交后的值

Question

我有一个带有选择下拉菜单1,7的表单字段，此onchange显示具有3个输入的1,7个字段集，这在我验证表单之前非常好，然后我需要一个函数来从下拉列表中获取发布值并显示再次正确数量的字段集

所以我需要添加一些功能，但我不确定最好的方法

我具有以下用于下拉菜单更改的功能，在页面重新加载时，我需要使用下拉菜单的POST值显示正确数量的字段集。任何想法都将非常有帮助，而不适合使用javascript！

$(function() {
$('#plaat1 , #plaat2, #plaat3, #plaat4, #plaat5, #plaat6, 
#plaat7').hide(); 
$('#plaatnum').change(function(){


    if($('#plaatnum').val() == '0') {
        $('#plaat1').hide();
        $('#plaat2').hide();
        $('#plaat3').hide();
        $('#plaat4').hide();
        $('#plaat5').hide();
        $('#plaat6').hide();
        $('#plaat7').hide();
    } 


    if($('#plaatnum').val() == '1') {
        $('#plaat1').show();
        $('#plaat2').hide();
        $('#plaat3').hide();
        $('#plaat4').hide();
        $('#plaat5').hide();
        $('#plaat6').hide();
        $('#plaat7').hide();
    } 

    if($('#plaatnum').val() == '2') {
        $('#plaat1').show();
        $('#plaat2').show();
        $('#plaat3').hide();
        $('#plaat4').hide();
        $('#plaat5').hide();
        $('#plaat6').hide();
        $('#plaat7').hide();
    } 

    if($('#plaatnum').val() == '3') {
        $('#plaat1').show();
        $('#plaat2').show();
        $('#plaat3').show();
        $('#plaat4').hide();
        $('#plaat5').hide();
        $('#plaat6').hide();
        $('#plaat7').hide();
    } 

    if($('#plaatnum').val() == '4') {
        $('#plaat1').show();
        $('#plaat2').show();
        $('#plaat3').show();
        $('#plaat4').show();
        $('#plaat5').hide();
        $('#plaat6').hide();
        $('#plaat7').hide();
    } 

    if($('#plaatnum').val() == '5') {
        $('#plaat1').show();
        $('#plaat2').show();
        $('#plaat3').show();
        $('#plaat4').show();
        $('#plaat5').show();
        $('#plaat6').hide();
        $('#plaat7').hide();
    } 

    if($('#plaatnum').val() == '6') {
        $('#plaat1').show();
        $('#plaat2').show();
        $('#plaat3').show();
        $('#plaat4').show();
        $('#plaat5').show();
        $('#plaat6').show();
        $('#plaat7').hide();
    } 

    if($('#plaatnum').val() == '7') {
        $('#plaat1').show();
        $('#plaat2').show();
        $('#plaat3').show();
        $('#plaat4').show();
        $('#plaat5').show();
        $('#plaat6').show();
        $('#plaat7').show();
    } 
});
});             

Answer 1

我已经清理了您的设置，因为像这样的大型IF链很重要。 此外，表单值应该在重新加载时出现，因此请使用文档就绪的侦听器。

$(function() {
$('#plaat1 , #plaat2, #plaat3, #plaat4, #plaat5, #plaat6, 
#plaat7').hide(); 
function doStuff(){
   var storedValue = $('#plaatnum').val();
   for(var i = 1; i < 8; i++) {
      if(i <= storedValue) {
         $('#plaat' + i).show(); 
      } else {
         $('#plaat' + i).hide();
      }
   }
}
$('#plaatnum').change(doStuff);
$(document).ready(doStuff);
});