jQuery Datepicker没有从这个min属性获取minDate

时间:2014-10-22 09:57:57

标签: javascript jquery html

我错过了一些完全明显的东西吗?

HTML

<input class="datepicker" min="2014-10-22" name="start_date" type="text" value="2014-11-22" id="start_date">

的Javascript

$(function() {
    $(".datepicker").datepicker({
        minDate: $(this).attr('min'),
        // minDate: '2014-10-22',
        dateFormat: 'yy-mm-dd',
        onSelect: function() {
            console.log($(this).attr('min'));
        }
    });
});

onSelect显示它正确获取了min属性。但是minDate似乎忽略了它。

如果我对其进行硬编码,那么它可以正常工作,但如果我使用minDate: $(this).attr('min'),则不会设置minDate。

1 个答案:

答案 0 :(得分:3)

因为您在dom ready回调中调用$(this).attr('min'),其中this引用文档对象而不是input元素。

如果页面中只有一个日期选择器,您可以将其更改为$('.datepicker').attr('min')

但如果有超过1则

&#13;
&#13;
$(function() {
  $(".datepicker").each(function() {
    $(this).datepicker({
      minDate: $(this).attr('min'),
      // minDate: '2014-10-22',
      dateFormat: 'yy-mm-dd',
      onSelect: function() {
        console.log($(this).attr('min'));
      }
    });
  })
});
&#13;
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/redmond/jquery-ui.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.js"></script>

<input class="datepicker" min="2014-10-22" name="start_date" type="text" value="2014-11-22" id="start_date">
<input class="datepicker" min="2014-11-22" name="start_date" type="text" value="2014-11-22" id="end_date">
&#13;
&#13;
&#13;