Почему jQuery не принимает мой #ID из массива?

#javascript #jquery #arrays #for-loop #datepicker

#javascript #jquery #массивы #for-цикл #datepicker

Вопрос:

Я пытаюсь добавить 3 указателя даты в 3 моих поля ввода, поэтому я повторяю следующий код:

Это работает:

 jQuery(function(){
    jQuery("#newnessdate").datepicker({
        dateFormat: 'yy-mm-dd',
        monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
        dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
        dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
    });
});

jQuery(function(){
    jQuery("#availabilitydate").datepicker({
        dateFormat: 'yy-mm-dd',
        monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
        dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
        dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
    });
});

jQuery(function(){
    jQuery("#expirydate").datepicker({
        dateFormat: 'yy-mm-dd',
        monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
        dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
        dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
    });
});
  

Это не:

 var dateIds = [
    "#newnessdate", 
    "#availabilitydate",
    "#expirydate"
];

for (var i = 0; i < dateIds.length; i  )
{
    jQuery(function(){
        jQuery(dateIds[i]).datepicker({
            dateFormat: 'yy-mm-dd',
            monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
            dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
            dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
        });
    });
}
  

Я много тестировал его и не понимаю, почему он не работает, но в строке

 jQuery(dateIds[i]).datepicker({
  

похоже, функция jQuery не принимает строки из массива в качестве строк. Вы можете мне помочь?

Комментарии:

1. У вас слишком много jQuery(function(){ операторов.

2. ‘#epages_expirydate’ — это не dateIds[i], поскольку dateIds [i] — это ‘#expirydate’ . возможно, вы хотели jQuery('#epages' dateIds[i]).datepicker({ и dateIds без «#»? (Я полагаю, что структура HTML одинакова для обоих сценариев)

3. Как все это работает со всеми этими синтаксическими ошибками?

4. о боже, я изменил свою проблему, чтобы упростить ее, и забыл удалить «epages_». Это было просто для упрощения.

Ответ №1:

 $("#newnessdate, #availabilitydate, #expirydate").datepicker({
            dateFormat: 'yy-mm-dd',
            monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
            dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
            dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
        });
    });
}
  

Комментарии:

1. Это более похожий на jQuery способ сделать это. 🙂

2. Вау, спасибо, это более простое и короткое решение. Несмотря на то, что моя настоящая проблема заключалась в том, что слишком много использований «jQuery (function(){…})»

3. 😀 jQuery — это весело, когда понимаешь, как много способов выбирать вещи!

Ответ №2:

Проблема, с которой вы сталкиваетесь, заключается в том, что цикл завершается при вызове обратного вызова, а значение i равно значению end of loop .

Простое исправление (с дополнительным преимуществом отсутствия умножения вызовов на $.ready ) :

 jQuery(function(){
    for (var i = 0; i < dateIds.length; i  )
    {
            jQuery(dateIds[i]).datepicker({
                dateFormat: 'yy-mm-dd',
                monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
                dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
                dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
            });
        }
    }
);
  

Ответ №3:

ДЕМОНСТРАЦИЯ

 var dateIds = [
    "#newnessdate", 
    "#availabilitydate",
    "#expirydate"
];

var options = {
    dateFormat: 'yy-mm-dd',
    monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
    dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag','Samstag'],
    dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']
};

$.each(dateIds, function(k, v) {
    $(v).datepicker(options); 
});
  

Ответ №4:

Согласно документации «jQuery (обратный вызов)» является аналогом «jQuery (document).готово (обратный вызов)». Вы теряете контекст (итератор цикла «i»), поэтому лучше сделайте это так:

 jQuery(function(){
    var dateIds = [
        "#newnessdate", 
        "#availabilitydate",
        "#expirydate"
    ];

    for (var i = 0; i < dateIds.length; i  )
    {
        jQuery(dateIds[i]).datepicker({
            .......
        });
    }
});
  

Это экономит контекст цикла и предотвращает создание нескольких прослушивателей событий (готовых документов). Если вам нужно получить доступ к данным массива из глобального контекста, просто поместите его вне функции обратного вызова, но использование глобального контекста для хранения данных — плохая практика.