1

我有以下 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>

和以下 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();
    });

如何首先检查输入“until_date”和“since_date”是否为空，如果它们为空以在脚本执行ajax调用之前停止脚本，提醒用户错误，然后如果输入继续不再是空的。我必须使用.one(). 我试过了。blur()功能，但没有效果...

4

3 回答 3

5

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');
        }
    });
});
于 2013-05-09T15:20:58.267 回答
1 
<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>

在这种情况下，您需要为您的表格命名

于 2014-07-08T15:54:37.547 回答
1

终于明白了

    
$(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>

于 2017-07-17T11:00:15.627 回答