Как проверить, установлены ли элементы datepicker и timepicker с помощью JQuery/Javascript

Question

У меня есть 2 выбора даты и 2 соответствующих таймера в HTML-странице. Таким образом, каждый раз, когда пользователь нажимает и выбирает какой-либо один datepicker (и/или timepicker), функция будет отклонена, и она проверит, имеют ли все 4 соответствующие поля значения внутри них.

Как добиться этого с помощью JS/jQuery?

Это мой HTML-код:

<input type="text" id="from-datepicker"/> 
    <input class="timepicker" name="timepicker" id="from-timepicker"/> 

<input type="text" id="to-datepicker"/> 
    <input class="timepicker" name="timepicker" id="to-timepicker"/> 

Answer 1

Во-первых, у вас есть два входа с тем же именем.

Во-вторых, вы должны добавлять события к элементам. Вот список DOM Events и jQuery events, который может быть запущен для множества целей.

В вашем конкретном сценарии вам необходимо проверить, изменилось ли значение для них. Вы можете использовать DOM-событие onchange.

JS change event:

elem = document.getElementById("id"); 
elem.addEventListener("change", yourFunction); 

jQuery.change:

$("#id").change(function() { 
    // some code 
}); 

Теперь, если вы хотите, чтобы увидеть, если вход имеет значение для него, ваша функция должна выглядеть следующим образом:

$("#id").change(function() { 
    // this = the element for which the event was triggered 
    if($(this).val() != "") { 
     // code if empty 
    } else { 
     // code if not empty 
    } 
});