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

你可以在你的功能中尝试这样做

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

也请查看此链接 https://jsfiddle.net/km9attz6/1/

Answer 2

试试这个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
    });
};

Datepicker不会因点击按钮而改变？

2 个答案: