Диапазон дат DatePicker для пользовательского интерфейса jQuery

Question

Я использую плагин jQuery UI с функцией Datepicker, чтобы установить диапазон дат. В примере, представленном на их странице (http://jqueryui.com/demos/datepicker/date-range.html), устанавливается диапазон на основе ввода 'id'; однако я хотел бы установить диапазон на основе 'class', поскольку моя форма 'клонирует' div для добавления дополнительных входов , делая поля 'id' уникальными для каждого клона. Когда я изменяю JavaScript для использования 'class' вместо 'id', диапазоны больше не работают.

JavaScript:

<script src="../../scripts/jquery-1.6.4.js"></script>
<script src="../../scripts/jqueryui/ui/jquery.ui.core.js"></script>
<script src="../../scripts/jqueryui/ui/jquery.ui.datepicker.js"></script>
<script>
        $(function() {
            var dates = $( ".start_date, .end_date" ).datepicker({
                onSelect: function( selectedDate ) {
                    var option = this.class == "start_date" ? "minDate" : "maxDate",
                        instance = $( this ).data( "datepicker" ),
                        date = $.datepicker.parseDate(
                            instance.settings.dateFormat ||
                            $.datepicker._defaults.dateFormat,
                            selectedDate, instance.settings );
                    dates.not( this ).datepicker( "option", option, date );
                }       
            }); 
        });
</script>

HTML:

<div>
    <label> Start Date:</label>
    <input type="text" name="start_date1" id="start_date1" class="start_date" />
</div>
<div>
    <label> End Date:</label>
    <input type="text" name="end_date1" id="end_date1" class="end_date" />
</div>

Answer 1

Чтобы проверить, есть ли у вашего элемента класс, сделайте следующее:

 if ($(this).is('.start_date')) {

или

 if ($(this).hasClass('start_date')) {

Имя свойства элементов DOM - "className", а не "class" (сбивает с толку). Кроме того, это делает ваш код хрупким, чтобы проверить, совпадает ли имя класса с какой-либо строкой, потому что вы никогда не знаете, хотите ли вы добавить другой класс (например, «требуется»). Таким образом, вы всегда должны проверять либо с помощью jQuery, либо с каким-либо другим методом, который учитывает вероятность того, что объект может иметь много классов.

Также вы можете проверить Выбор диапазона дат в Filament Group для jQuery.