javascript - 在 jQuery 可靠下拉列表中显示最后一个值的最佳方法是什么？

Question

如果我们使用以下示例，我怎样才能让表单保持下拉字段的最后一个默认选择？如果不显示“选择县”，如果存在变量，它怎么能首先存储变量，否则如果没有已知变量，则“选择县”第二个？

如果重新访问或编辑此表单，则选择默认为“选择县”和“选择假日公园”默认设置，我希望它回忆用户所做的选择，仅在全新的首次提交时才显示这些标题. 有没有可能，解释清楚了吗？问候

var myJson = {
  "property_city_front_autointernal": [{
    "name": "Cornwall",
    "id": "Cornwall",
    "property_area_front": [

      {
        "name": "Crantock Beach  (Parkdean)",
        "id": "Crantock Beach  (Parkdean)",
      },
      {
        "name": "Holywell Bay  (Parkdean)",
        "id": "Holywell Bay  (Parkdean)",
      },
      {
        "name": "Looe Bay  (Parkdean)",
        "id": "Looe Bay  (Parkdean)",
      },
      {
        "name": "Lizard Point  (Parkdean)",
        "id": "Lizard Point  (Parkdean)",
      },
      {
        "name": "Newquay  (Parkdean)",
        "id": "Newquay  (Parkdean)",
      },
      {
        "name": "Sea Acres  (Parkdean)",
        "id": "Sea Acres  (Parkdean)",
      },
      {
        "name": "St Minver  (Parkdean)",
        "id": "St Minver  (Parkdean)",
      },
      {
        "name": "White Acres  (Parkdean)",
        "id": "White Acres  (Parkdean)",
      },
      {
        "name": "Perran Sands  (Haven)",
        "id": "Perran Sands  (Haven)",
      },
      {
        "name": "Riviere Sands  (Haven)",
        "id": "Riviere Sands  (Haven)",
      },
      {
        "name": "St Ives Holiday Village  (John Fowler)",
        "id": "St Ives Holiday Village  (John Fowler)",
      },
      {
        "name": "Killigarth Manor  (John Fowler)",
        "id": "Killigarth Manor  (John Fowler)",
      },
      {
        "name": "Perran View  (John Fowler)",
        "id": "Perran View  (John Fowler)",
      },
      {
        "name": "Tolroy Manor  (John Fowler)",
        "id": "Tolroy Manor  (John Fowler)",
      },
      {
        "name": "Trelawne Manor  (John Fowler)",
        "id": "Trelawne Manor  (John Fowler)",
      },
      {
        "name": "Widemouth Bay  (John Fowler)",
        "id": "Widemouth Bay  (John Fowler)",
      },
    ]
  }, {
    "name": "Devon",
    "id": "Devon",
    "property_area_front": [

      {
        "name": "Devon Cliffs  (Haven)",
        "id": "Devon Cliffs  (Haven)",
      },
      {
        "name": "Bideford Bay  (Parkdean)",
        "id": "Bideford Bay  (Parkdean)",
      },
      {
        "name": "Challaborough Bay  (Parkdean)",
        "id": "Challaborough Bay  (Parkdean)",
      },
      {
        "name": "Ruda  (Parkdean)",
        "id": "Ruda  (Parkdean)",
      },
      {
        "name": "Torquay  (Parkdean)",
        "id": "Torquay  (Parkdean)",
      },
      {
        "name": "Waterside   (Park Holiday)",
        "id": "Waterside   (Park Holiday)",
      },
      {
        "name": "Tarka  (Park Holiday)",
        "id": "Tarka  (Park Holiday)",
      },
      {
        "name": "Riviera Bay  (Park Holiday)",
        "id": "Riviera Bay  (Park Holiday)",
      },
      {
        "name": "Landscove  (Park Holiday)",
        "id": "Landscove  (Park Holiday)",
      },
      {
        "name": "Golden Sands  (Park Holiday)",
        "id": "Golden Sands  (Park Holiday)",
      },
      {
        "name": "Dawlish Sands  (Park Holiday)",
        "id": "Dawlish Sands  (Park Holiday)",
      },
      {
        "name": "Combe Martin  (John Fowler)",
        "id": "Combe Martin  (John Fowler)",
      },
      {
        "name": "Sandaway Beach  (John Fowler)",
        "id": "Sandaway Beach  (John Fowler)",
      },
      {
        "name": "South Bay  (John Fowler)",
        "id": "South Bay  (John Fowler)",
      },
    ]
  }, {
    "name": "Somerset",
    "id": "Somerset",
    "property_area_front": [

      {
        "name": "Sandy Glade  (John Fowler)",
        "id": "Sandy Glade  (John Fowler)",
      },
      {
        "name": "Sandy Meadows  (John Fowler)",
        "id": "Sandy Meadows  (John Fowler)",
      },
      {
        "name": "Burnham on Sea  (Haven)",
        "id": "Burnham on Sea  (Haven)",
      },
      {
        "name": "Doniford Bay  (Haven)",
        "id": "Doniford Bay  (Haven)",
      },
    ]
  }, {
    "name": "Wales",
    "id": "Wales",
    "property_area_front": [

      {
        "name": "Llanrhidian  (John Fowler)",
        "id": "Llanrhidian  (John Fowler)",
      },
      {
        "name": "Brynowen  (Parkdean)",
        "id": "Brynowen  (Parkdean)",
      },
      {
        "name": "Carmarthen Bay  (Parkdean)",
        "id": "Carmarthen Bay  (Parkdean)",
      },
      {
        "name": "Pendine Sands  (Parkdean)",
        "id": "Pendine Sands  (Parkdean)",
      },
      {
        "name": "Trecco Bay  (Parkdean)",
        "id": "Trecco Bay  (Parkdean)",
      },
      {
        "name": "Ty Mawr  (Parkdean)",
        "id": "Ty Mawr  (Parkdean)",
      },
      {
        "name": "Kiln Park  (Haven)",
        "id": "Kiln Park  (Haven)",
      },
      {
        "name": "Greenacres  (Haven)",
        "id": "Greenacres  (Haven)",
      },
      {
        "name": "Hafan-Y-Mor  (Haven)",
        "id": "Hafan-Y-Mor  (Haven)",
      },
      {
        "name": "Lydstep Beach  (Haven)",
        "id": "Lydstep Beach  (Haven)",
      },
      {
        "name": "Penally Court  (Haven)",
        "id": "Penally Court  (Haven)",
      },
      {
        "name": "Presthaven  (Haven)",
        "id": "Presthaven  (Haven)",
      },
      {
        "name": "Quay West  (Haven)",
        "id": "Quay West  (Haven)",
      },
    ]
  }, {
    "name": "Yorkshire",
    "id": "Yorkshire",
    "property_area_front": [

      {
        "name": "Skirlington Leisure Park  (Skirlington leisure)",
        "id": "Skirlington Leisure Park  (Skirlington leisure)",
      },
      {
        "name": "Gransmoor Lodge  (Skirlington leisure)",
        "id": "Gransmoor Lodge  (Skirlington leisure)",
      },
      {
        "name": "Springfield Farm  (Skirlington leisure)",
        "id": "Springfield Farm  (Skirlington leisure)",
      },
      {
        "name": "Glen Esk Holiday Park  (Skirlington leisure)",
        "id": "Glen Esk Holiday Park  (Skirlington leisure)",
      },
      {
        "name": "Atwick Cliff Top Welford Park  (Skirlington leisure)",
        "id": "Atwick Cliff Top Welford Park  (Skirlington leisure)",
      },
      {
        "name": "Barmston Beach  (Parkdean)",
        "id": "Barmston Beach  (Parkdean)",
      },
      {
        "name": "Cayton Bay  (Parkdean)",
        "id": "Cayton Bay  (Parkdean)",
      },
      {
        "name": "Skipsea Sands  (Parkdean)",
        "id": "Skipsea Sands  (Parkdean)",
      },
      {
        "name": "Withernsea Sands  (Parkdean)",
        "id": "Withernsea Sands  (Parkdean)",
      },
      {
        "name": "Blue Dolphin  (Haven)",
        "id": "Blue Dolphin  (Haven)",
      },
      {
        "name": "Primrose Valley  (Haven)",
        "id": "Primrose Valley  (Haven)",
      },
      {
        "name": "Reighton Sands  (Haven)",
        "id": "Reighton Sands  (Haven)",
      },
      {
        "name": "Thornwick Bay  (Haven)",
        "id": "Thornwick Bay  (Haven)",
      },
    ]
  }, {
    "name": "Dorset",
    "id": "Dorset",
    "property_area_front": [

      {
        "name": "Littlesea  (Haven)",
        "id": "Littlesea  (Haven)",
      },
      {
        "name": "Rockley Park  (Haven)",
        "id": "Rockley Park  (Haven)",
      },
      {
        "name": "Seaview  (Haven)",
        "id": "Seaview  (Haven)",
      },
      {
        "name": "Weymouth Bay  (Haven)",
        "id": "Weymouth Bay  (Haven)",
      },
      {
        "name": "Sandford  (Parkdean)",
        "id": "Sandford  (Parkdean)",
      },
      {
        "name": "Warmwell  (Parkdean)",
        "id": "Warmwell  (Parkdean)",
      },
      {
        "name": "West Bay  (Parkdean)",
        "id": "West Bay  (Parkdean)",
      },
      {
        "name": "Sandhills  (Park Holiday)",
        "id": "Sandhills  (Park Holiday)",
      },
    ]
  }, {
    "name": "Lancashire",
    "id": "Lancashire",
    "property_area_front": [

      {
        "name": "Ocean Edge  (Parkdean)",
        "id": "Ocean Edge  (Parkdean)",
      },
      {
        "name": "Regent Bay  (Parkdean)",
        "id": "Regent Bay  (Parkdean)",
      },
      {
        "name": "Todber Valley  (Parkdean)",
        "id": "Todber Valley  (Parkdean)",
      },
      {
        "name": "Cala Gran  (Haven)",
        "id": "Cala Gran  (Haven)",
      },
      {
        "name": "Marton Mere  (Haven)",
        "id": "Marton Mere  (Haven)",
      },
    ]
  }, {
    "name": "Lincolnshire",
    "id": "Lincolnshire",
    "property_area_front": [

      {
        "name": "Southview  (Parkdean)",
        "id": "Southview  (Parkdean)",
      },
      {
        "name": "Sunnydale  (Parkdean)",
        "id": "Sunnydale  (Parkdean)",
      },
      {
        "name": "Golden Sands  (Haven)",
        "id": "Golden Sands  (Haven)",
      },
      {
        "name": "Thorpe Park  (Haven)",
        "id": "Thorpe Park  (Haven)",
      },
    ]
  }, {
    "name": "Kent",
    "id": "Kent",
    "property_area_front": [

      {
        "name": "Romney Sands  (Parkdean)",
        "id": "Romney Sands  (Parkdean)",
      },
      {
        "name": "St. Margaret's Bay  (Parkdean)",
        "id": "St. Margaret's Bay  (Parkdean)",
      },
      {
        "name": "Allhallows  (Haven)",
        "id": "Allhallows  (Haven)",
      },
      {
        "name": "Seaview  (Park Holiday)",
        "id": "Seaview  (Park Holiday)",
      },
      {
        "name": "New Beach  (Park Holiday)",
        "id": "New Beach  (Park Holiday)",
      },
      {
        "name": "Marlie  (Park Holiday)",
        "id": "Marlie  (Park Holiday)",
      },
      {
        "name": "Harts  (Park Holiday)",
        "id": "Harts  (Park Holiday)",
      },
      {
        "name": "Birchington Vale  (Park Holiday)",
        "id": "Birchington Vale  (Park Holiday)",
      },
      {
        "name": "Alberta  (Park Holiday)",
        "id": "Alberta  (Park Holiday)",
      },
    ]
  }, {
    "name": "Sussex",
    "id": "Sussex",
    "property_area_front": [

      {
        "name": "Winchelsea Sands  (Park Holiday)",
        "id": "Winchelsea Sands  (Park Holiday)",
      },
      {
        "name": "Rye Harbour   (Park Holiday)",
        "id": "Rye Harbour   (Park Holiday)",
      },
      {
        "name": "Pevensey Bay  (Park Holiday)",
        "id": "Pevensey Bay  (Park Holiday)",
      },
      {
        "name": "Coghurst Hall  (Park Holiday)",
        "id": "Coghurst Hall  (Park Holiday)",
      },
      {
        "name": "Chichester Lakeside  (Park Holiday)",
        "id": "Chichester Lakeside  (Park Holiday)",
      },
      {
        "name": "Beauport  (Park Holiday)",
        "id": "Beauport  (Park Holiday)",
      },
      {
        "name": "Camber Sands  (Parkdean)",
        "id": "Camber Sands  (Parkdean)",
      },
      {
        "name": "Church Farm  (Haven)",
        "id": "Church Farm  (Haven)",
      },
      {
        "name": "Combe Haven  (Haven)",
        "id": "Combe Haven  (Haven)",
      },
    ]
  }, {
    "name": "Hampshire / Isle of Wight",
    "id": "Hampshire / Isle of Wight",
    "property_area_front": [

      {
        "name": "Solent Breezes  (Park Holiday)",
        "id": "Solent Breezes  (Park Holiday)",
      },
      {
        "name": "Hayling Island  (Parkdean)",
        "id": "Hayling Island  (Parkdean)",
      },
      {
        "name": "Landguard  (Parkdean)",
        "id": "Landguard  (Parkdean)",
      },
      {
        "name": "Lower Hyde  (Parkdean)",
        "id": "Lower Hyde  (Parkdean)",
      },
      {
        "name": "Nodes Point  (Parkdean)",
        "id": "Nodes Point  (Parkdean)",
      },
      {
        "name": "Thorness Bay  (Parkdean)",
        "id": "Thorness Bay  (Parkdean)",
      },
    ]
  }, {
    "name": "Essex",
    "id": "Essex",
    "property_area_front": [

      {
        "name": "Steeple Bay  (Park Holiday)",
        "id": "Steeple Bay  (Park Holiday)",
      },
      {
        "name": "St Osyth Beach  (Park Holiday)",
        "id": "St Osyth Beach  (Park Holiday)",
      },
      {
        "name": "Seawick  (Park Holiday)",
        "id": "Seawick  (Park Holiday)",
      },
      {
        "name": "Martello Beach  (Park Holiday)",
        "id": "Martello Beach  (Park Holiday)",
      },
      {
        "name": "Dovercourt  (Park Holiday)",
        "id": "Dovercourt  (Park Holiday)",
      },
      {
        "name": "West Mersea  (Park Holiday)",
        "id": "West Mersea  (Park Holiday)",
      },
      {
        "name": "Oaklands  (Park Holiday)",
        "id": "Oaklands  (Park Holiday)",
      },
      {
        "name": "Coopers Beach  (Parkdean)",
        "id": "Coopers Beach  (Parkdean)",
      },
      {
        "name": "Highfield Grange  (Parkdean)",
        "id": "Highfield Grange  (Parkdean)",
      },
      {
        "name": "Naze Marine  (Parkdean)",
        "id": "Naze Marine  (Parkdean)",
      },
      {
        "name": "Valley Farm  (Parkdean)",
        "id": "Valley Farm  (Parkdean)",
      },
      {
        "name": "Weeley Bridge  (Parkdean)",
        "id": "Weeley Bridge  (Parkdean)",
      },
      {
        "name": "The Orchards  (Haven)",
        "id": "The Orchards  (Haven)",
      },
    ]
  }, {
    "name": "Suffolk",
    "id": "Suffolk",
    "property_area_front": [

      {
        "name": "Suffolk Sands  (Park Holiday)",
        "id": "Suffolk Sands  (Park Holiday)",
      },
      {
        "name": "Felixstowe Beach  (Park Holiday)",
        "id": "Felixstowe Beach  (Park Holiday)",
      },
      {
        "name": "Carlton Meres  (Park Holiday)",
        "id": "Carlton Meres  (Park Holiday)",
      },
      {
        "name": "Broadland Sands  (Park Holiday)",
        "id": "Broadland Sands  (Park Holiday)",
      },
      {
        "name": "Kessingland Beach  (Parkdean)",
        "id": "Kessingland Beach  (Parkdean)",
      },
    ]
  }, {
    "name": "Scotland",
    "id": "Scotland",
    "property_area_front": [

      {
        "name": "Craig Tara  (Haven)",
        "id": "Craig Tara  (Haven)",
      },
      {
        "name": "Seton Sands  (Haven)",
        "id": "Seton Sands  (Haven)",
      },
      {
        "name": "Eyemouth  (Parkdean)",
        "id": "Eyemouth  (Parkdean)",
      },
      {
        "name": "Grannie's Heilan' Hame  (Parkdean)",
        "id": "Grannie's Heilan' Hame  (Parkdean)",
      },
      {
        "name": "Nairn Lochloy  (Parkdean)",
        "id": "Nairn Lochloy  (Parkdean)",
      },
      {
        "name": "Sandylands  (Parkdean)",
        "id": "Sandylands  (Parkdean)",
      },
      {
        "name": "Southerness  (Parkdean)",
        "id": "Southerness  (Parkdean)",
      },
      {
        "name": "Sundrum Castle  (Parkdean)",
        "id": "Sundrum Castle  (Parkdean)",
      },
      {
        "name": "Tummel Valley  (Parkdean)",
        "id": "Tummel Valley  (Parkdean)",
      },
      {
        "name": "Wemyss Bay  (Parkdean)",
        "id": "Wemyss Bay  (Parkdean)",
      },
    ]
  }, {
    "name": "Cumbria",
    "id": "Cumbria",
    "property_area_front": [

      {
        "name": "Fallbarrow  (Parkdean)",
        "id": "Fallbarrow  (Parkdean)",
      },
      {
        "name": "Gatebeck  (Parkdean)",
        "id": "Gatebeck  (Parkdean)",
      },
      {
        "name": "Limefitt Park (Parkdean)",
        "id": "Limefitt Park (Parkdean)",
      },
      {
        "name": "White Cross Bay  (Parkdean)",
        "id": "White Cross Bay  (Parkdean)",
      },
      {
        "name": "Lakeland  (Haven)",
        "id": "Lakeland  (Haven)",
      },
    ]
  }, {
    "name": "Durham",
    "id": "Durham",
    "property_area_front": [

      {
        "name": "Crimdon Dene  (Parkdean)",
        "id": "Crimdon Dene  (Parkdean)",
      },
    ]
  }, {
    "name": "Norfolk",
    "id": "Norfolk",
    "property_area_front": [

      {
        "name": "Caister  (Haven)",
        "id": "Caister  (Haven)",
      },
      {
        "name": "Hopton  (Haven)",
        "id": "Hopton  (Haven)",
      },
      {
        "name": "Seashore  (Haven)",
        "id": "Seashore  (Haven)",
      },
      {
        "name": "Wild Duck  (Haven)",
        "id": "Wild Duck  (Haven)",
      },
      {
        "name": "Breydon Water  (Parkdean)",
        "id": "Breydon Water  (Parkdean)",
      },
      {
        "name": "California Cliffs  (Parkdean)",
        "id": "California Cliffs  (Parkdean)",
      },
      {
        "name": "Cherry Tree  (Parkdean)",
        "id": "Cherry Tree  (Parkdean)",
      },
      {
        "name": "Heacham Beach  (Parkdean)",
        "id": "Heacham Beach  (Parkdean)",
      },
      {
        "name": "Manor Park  (Parkdean)",
        "id": "Manor Park  (Parkdean)",
      },
      {
        "name": "Summerfields  (Parkdean)",
        "id": "Summerfields  (Parkdean)",
      },
      {
        "name": "Vauxhall  (Parkdean)",
        "id": "Vauxhall  (Parkdean)",
      },
    ]
  }, {
    "name": "Northumberland",
    "id": "Northumberland",
    "property_area_front": [

      {
        "name": "Berwick  (Haven)",
        "id": "Berwick  (Haven)",
      },
      {
        "name": "Haggerston Castle  (Haven)",
        "id": "Haggerston Castle  (Haven)",
      },
      {
        "name": "Church Point  (Parkdean)",
        "id": "Church Point  (Parkdean)",
      },
      {
        "name": "Cresswell Towers  (Parkdean)",
        "id": "Cresswell Towers  (Parkdean)",
      },
      {
        "name": "Sandy Bay  (Parkdean)",
        "id": "Sandy Bay  (Parkdean)",
      },
      {
        "name": "Whitley Bay  (Parkdean)",
        "id": "Whitley Bay  (Parkdean)",
      }
    ]
  }]

}



$.each(myJson.property_city_front_autointernal, function(index, value) {
  $("#property_city_front_autointernal").append('<option value="' + value.id + '">' + value.name + '</option>');
});

$('#property_city_front_autointernal').on('change', function() {
  console.log($(this).val());
  for (var i = 0; i < myJson.property_city_front_autointernal.length; i++) {
    if (myJson.property_city_front_autointernal[i].id == $(this).val()) {
      $('#property_area_front').html('<option value="Choose Holiday Park">Choose Holiday Park</option>');
      $.each(myJson.property_city_front_autointernal[i].property_area_front, function(index, value) {
        $("#property_area_front").append('<option value="' + value.id + '">' + value.name + '</option>');
        $("select option[value*='Choose Holiday Park']").prop('disabled', true);

      });
    }
  }
});


$(document).ready(function() {


  $("#edit_prop_1").attr("disabled", true);

  $('#property_city_front_autointernal').change(function() {
    $("#edit_prop_1").attr("disabled", true);
  });

  $('#property_area_front').change(function() {
    if ($('property_area_front').val() == "Choose Holiday Park") {
      $("#edit_prop_1").attr("disabled", true);

    } else {
      $("#edit_prop_1").attr("disabled", false);

    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<select id="property_city_front_autointernal" name="property_city_front">
  <option selected="true" disabled="disabled">Choose County</option>
</select>
<select id="property_area_front" name="property_area_front">
  <option selected="true" disabled="disabled">Choose Holiday Park</option>
</select>
<div class="col-md-12" style="display: inline-block;">
  <input type="submit" class="wpb_btn-info wpb_btn-small wpestate_vc_button  vc_button" id="edit_prop_1" value="Next" />

标签： javascriptjquerydropdown