Datepicker 不会根据按钮单击而更改？

Question

我有两个单选按钮，如下所示：-

<input type="radio" id="Users_gender_0" name="Users[gender]" value="1" onclick="getcaleder();" >Male
<input type="radio" id="Users_gender_1" name="Users[gender]" value="2" onclick="getcaleder();" >Female 
<input type="text" name="date_of_birth" id="Users_date_of_birth">

我想根据选择男性或女性在 date_of_birth 文本字段中加载两个不同的日历。

  $(document).ready(function () {

      $("#Users_gender_0").prop("checked", true);

      var dt = new Date();
      var day = dt.getDate();
      var month = dt.getMonth() + 1;
      var girlyear = dt.getFullYear() - 18;
      var boyyear = dt.getFullYear() - 21;

      $("#Users_date_of_birth").datepicker({
          changeMonth: true,
          changeYear: true,
          dateFormat: "yy-mm-dd",
          yearRange: '-50y:c+nn',
          maxDate: boyyear + '-' + month + '-' + day
      });


  });

  function getcaleder() {
      var gender = $('input[name= "Users[gender]" ]:checked').val();

      var dt = new Date();
      var day = dt.getDate();
      var month = dt.getMonth() + 1;
      var girlyear = dt.getFullYear() - 18;
      var boyyear = dt.getFullYear() - 21;

      if (gender == 0) {

          var y = boyyear;
      } else {
          var y = girlyear;
      }

      $("#Users_date_of_birth").datepicker({
          changeMonth: true,
          changeYear: true,
          dateFormat: "yy-mm-dd",
          yearRange: '-50y:c+nn',
          maxDate: y + '-' + month + '-' + day
      });
  }

我给了上面的功能。在准备好文档时，我检查了男性性别并加载了一个日历，但是当单击女性时，则给出了更改日历的功能，但日历没有更改。为女性加载但与性别相同的日期选择器已加载。

I want calender till 1994 for males and till 1997 for females.

请大家帮忙。

Answer 1

试试这个 http://jsfiddle.net/fnRcL/393/

<input type="radio" checked="checked" name="Users[gender]" value="1" onclick="getcalender()" >Male
<input type="radio" name="Users[gender]" value="2" onclick="getcalender()" >Female 
<input type="text" name="date_of_birth" id="date_of_birth">

JS代码：

$(document).ready(function () {

    $("#Users_gender_0").prop("checked", true);

    var dt = new Date();
    var day = dt.getDate();
    var month = dt.getMonth() + 1;
    var girlyear = dt.getFullYear() - 18;
    var boyyear = dt.getFullYear() - 21;

    $("#date_of_birth").datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: "yy-mm-dd",
        yearRange: '-50y:c+nn',
        maxDate: boyyear + '-' + month + '-' + day
    });


});

getcalender = function() {
    $( "#date_of_birth" ).datepicker( "destroy" )
    var gender = $('input[name= "Users[gender]" ]:checked').val();

    var dt = new Date();
    var day = dt.getDate();
    var month = dt.getMonth() + 1;
    var girlyear = dt.getFullYear() - 18;
    var boyyear = dt.getFullYear() - 21;

    if (gender == 1) {
        var y = boyyear;
    } else {
        var y = girlyear;
    }

    $("#date_of_birth").datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: "yy-mm-dd",
        yearRange: '-50y:c+nn',
        maxDate: y + '-' + month + '-' + day
    });
};

Answer 2

你可以在你的函数中这样尝试

      $("#Users_date_of_birth").datepicker("destroy");

      $("#Users_date_of_birth").datepicker({
          changeMonth: true,
          changeYear: true,
          dateFormat: "yy-mm-dd",
          yearRange: '-50y:c+nn',
          maxDate: y + '-' + month + '-' + day
      });

还要检查这个 link https://jsfiddle.net/km9attz6/1/

Datepicker 不会根据按钮单击而更改？

Datepicker not changing based on a button click?

jquery

onchange

datepicker