如果在 Jquery 中 select 设置了日、月或年默认值，如何清空所有 select 字段值

Question

请在下面查看我的代码，如果 日、月或年 默认值为 select，我将尝试清除所有 select 字段值如果默认值不是 selected，那么应该显示选择的值并更新隐藏的输入字段，但由于某些原因它没有。

$('.date-dropdowns').on('change', '.day,.month,.year', function() {
  var d = $(this).parent().find('.day').val();
  var m = $(this).parent().find('.month').val();
  var y = $(this).parent().find('.year').val();
  var dmy = d + '/' + m + '/' + y;
  

  if(d === "" || m === "" || y === ""){
   $(this).parent().find('input[type=hidden]').val('');
   $(this).parent().find('select').prop('selectedIndex',0);
  }else{
   $(this).parent().find('input[type=hidden]').val(dmy);
  }
  
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="date-dropdowns">
<input type="hidden" id="acf-field_5a7cbdad4e6af-0-field_5a7b65d4e90ca-field_5a7b665f779f4" name="acf[field_5a7cbdad4e6af][0][field_5a7b65d4e90ca][field_5a7b665f779f4]" value="" required="required">
<select class="day" name="date_[day]">
    <option value="">Day</option>
    <option value="01">1st</option>
    <option value="02">2nd</option>
    <option value="03">3rd</option>
    <option value="04">4th</option>
</select>
<select class="month" name="date_[month]">
    <option value="">Month</option>
    <option value="01">January</option>
    <option value="02">February</option>
    <option value="03">March</option>
    <option value="04">April</option>
    <option value="05">May</option>
    <option value="06">June</option>
    <option value="07">July</option>
    <option value="08">August</option>
    <option value="09">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
</select>
<select class="year" name="date_[year]">
    <option value="">Year</option>
    <option value="2018">2018</option>
    <option value="2017">2017</option>
    <option value="2016">2016</option>
    <option value="2015">2015</option>
    <option value="2014">2014</option>
    <option value="2013">2013</option>
</select>
</div>

Answer 1

因为您的检查条件表明，如果年、月、日中的任何一个为默认值，则所有值都将重置为默认值。这始终是正确的，因为用户一次只能更改一个，其他的必须是默认的。您可能只想检查用户选择的那个是否是默认的。

$('.date-dropdowns').on('change', '.day,.month,.year', function() {
  var d = $(this).parent().find('.day').val();
  var m = $(this).parent().find('.month').val();
  var y = $(this).parent().find('.year').val();
  var dmy = d + '/' + m + '/' + y;


  if ($(this).val() === '') {
    $(this).parent().find('input[type=hidden]').val('');
    $(this).parent().find('select').prop('selectedIndex', 0);
  } else {
    $(this).parent().find('input[type=hidden]').val(dmy);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="date-dropdowns">
  <input type="hidden" id="acf-field_5a7cbdad4e6af-0-field_5a7b65d4e90ca-field_5a7b665f779f4" name="acf[field_5a7cbdad4e6af][0][field_5a7b65d4e90ca][field_5a7b665f779f4]" value="" required="required">
  <select class="day" name="date_[day]">
    <option value="">Day</option>
    <option value="01">1st</option>
    <option value="02">2nd</option>
    <option value="03">3rd</option>
    <option value="04">4th</option>
  </select>
  <select class="month" name="date_[month]">
    <option value="">Month</option>
    <option value="01">January</option>
    <option value="02">February</option>
    <option value="03">March</option>
    <option value="04">April</option>
    <option value="05">May</option>
    <option value="06">June</option>
    <option value="07">July</option>
    <option value="08">August</option>
    <option value="09">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
  </select>
  <select class="year" name="date_[year]">
    <option value="">Year</option>
    <option value="2018">2018</option>
    <option value="2017">2017</option>
    <option value="2016">2016</option>
    <option value="2015">2015</option>
    <option value="2014">2014</option>
    <option value="2013">2013</option>
  </select>
</div>

如果在 Jquery 中 select 设置了日、月或年默认值，如何清空所有 select 字段值

How to empty all select field value if either day, month or year default value is selected in Jquery

javascript

jquery

advanced-custom-fields