javascript 如何使用javascript或jquery检查输入类型日期是否为空
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16463501/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to check if input type date is empty or not using javascript or jquery
提问by Daniela costina Vaduva
I have the following HTML form:
我有以下 HTML 表单：
<form id="ChartsForm">
<div id="dateoptions">
<p>Until date: <input type="date" name="until_date" value="Until date"></p>
<p>Since date: <input type="date" name="since_date" value="Since date"></p>
</div>
<div class="insightsoptions">
<input id="newLikes" class="insightsbuttons" type="submit" name="submit" value="Daily new likes">
<input id="unlikes" class="insightsbuttons" type="submit" name="submit" value="Daily unlikes">
</div>
</form>
and the following JQuery script:
以及以下 JQuery 脚本：
$(function () {
$("#newLikes").one('click', function () {
$.ajax({type:'GET', url: 'newLikes.php', data:$('#ChartsForm').serialize(), success:
function(response) {
alert(response);
$("#dailyNewLikes").html(response);
}});
return false;
});
$("#newLikes").on('click', function(){
$(this).toggleClass('green');
$('#dailyNewLikes').toggle();
});
How do I check if the inputs "until_date" and "since_date" are empty or not in the first place and if they are empty to stop the script before it executes the ajax call, alert the user about the mistake and then continue if the inputs are not empty anymore. I have to use .one(). I've tried with the .blur()function but with no effect...
我如何首先检查输入“until_date”和“since_date”是否为空，如果它们为空以在执行 ajax 调用之前停止脚本，提醒用户错误，然后在输入时继续不再是空的。我必须使用.one(). 我试过用 . blur()功能，但没有效果...
回答by Andrew
Instead of using one()you could remove the handler upon success. If you need just the one function removed afterwards you could either use namespaced events(or a named function rather than an anonymous one). You could do something like this:
one()您可以在成功后删除处理程序，而不是使用。如果之后只需要删除一个函数，则可以使用命名空间事件（或命名函数而不是匿名函数）。你可以这样做：
$("#newLikes").on('click', function () {
var until = $('#dateoptions input[name="until_date"]').val();
var since = $('#dateoptions input[name="since_date"]').val();
if (until == "" || since == "") {
alert('Error; until date or since date is missing.');
return;
}
$.ajax({
type:'GET',
url: 'newLikes.php',
data: $('#ChartsForm').serialize(),
success: function(response) {
$("#dailyNewLikes").html(response);
$("#newLikes").off('click');
}
});
});
回答by Ritabrata Gautam
<script type="text/javascript">
if (document.forms["form_name"]["date_field_name"].value == "" || document.forms["form_name"]["date_field_name"].value == "1970-01-01")
{
alert('you missed to give date.');
return false;
}
</script>
in this case you will need to give a name to your form
在这种情况下，您需要为表单命名
回答by user3703182
Finally got it
终于明白了
$(function() {
$( "input[name^=datepicker]" ).datepicker({
onSelect: function(dateText, inst) {
if ($("input[name='datepicker_end']").val()!=""){
if($("input[name='datepicker']").val()>$("input[name='datepicker_end']").val()){
alert("invalid date");
}
}
}
});
})<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Datepicker - Restrict date range</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<p>Date: <input type="text" id="datepicker" name="datepicker"></p>
<p>Date: <input type="text" id="datepicker_end" name="datepicker_end"></p>
</body>
</html>