jQuery Datepicker中的onSelect事件似乎沒有觸發

Question

這可能只是一個簡單的錯誤，但是我花了最后3個小時試圖弄清楚它-沒有成功。

我最終想做的是使用輸入的日期，並將其與截止日期進行比較，以說明提交是否太遲。 但是，目前，為了簡化起見，我想告訴我日期已經更改，但是沒有成功。 我在哪里錯了？

$("#id_submission_date").datepicker({
    onSelect: function(dateText) {
        $("#late_submission_warning").text("Date selected");
    }
 });

這是頁面中的（縮短的）HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>  Feedback for Student, Test</title>
    <meta name="description" content="">
    <link href="/static/css/bootstrap.css" rel="stylesheet" media="screen">
    <link href="/static/css/jquery.qtip.min.css" rel="stylesheet">
    <style type="text/css">
        body {
            padding-top: 60px;
            padding-bottom: 40px;
        }
        .sidebar-nav{
            padding: 9px 0;
        }
    </style>
</head>

<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
...
</nav>

<form action="" method="post" accept-charset="utf-8" role="form">
<input type='hidden' name='csrfmiddlewaretoken' value='...' />

<div class="container">

    <h1>European Law (2013/2014): Essay</h1>
    <h2>Test Student</h2>
     ...

    <label for="submission_date">Submission Date</label>
    <input class="form-control" data-date-format="dd/mm/yyyy" id="id_submission_date" name="submission_date" type="text" value="13/04/2015" />

    <select class="form-control" id="id_category_mark_2" name="category_mark_2">
    <option value="" selected="selected">---------</option>
        <option value="39">0 - 39 %</option>
        <option value="49">40 - 49 %</option>
        <option value="59">50 - 59 %</option>
        <option value="69">60 - 69 %</option>
        <option value="79">70 - 79 %</option>
        <option value="80">80 or more</option>
    </select>

    <div id="late_submission_warning"></div>

    <h4>General Comments</h4>
    <textarea class="form-control" cols="40" id="id_comments" name="comments" rows="10">
    </textarea>
    <br><br>
    <input type = "submit" value="Save" class="btn btn-default">
    </form>
</div>

<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/bootstrap.js"></script>
<script src="/static/js/bootstrap-datepicker.js"></script>
<script src="/static/js/jquery.tablesorter.js"></script>
<script src="/static/js/jquery.metadata.js"></script>
<script src="/static/js/jquery.validate.min.js"></script>
<script src="/static/js/bootbox.min.js"></script>
<script src="/static/js/jquery.qtip.min.js"></script>

<script type="text/javascript">

$(document).ready(function() 
    { 
    $("#sortable_table").tablesorter({
        sortList: [[0,0],[1,0]]
        }); 
    } 
); 

</script>

<script type="text/javascript">
$(document).ready(function(){

    $("#id_submission_date").datepicker({
        onSelect: function(dateText) {
            console.log(dateText);
        }
    });

    $("#category_2").qtip({
        content: {
            text: '80+ very full and perceptive awareness of issues, with original critical and analytical assessment of the issues and an excellent grasp of their wider significance.<br />70+ full and perceptive awareness of issues and a clear grasp of their wider significance.<br />60 - 69 adequate awareness of issues and a serious understanding of their wider significance.<br />50 - 59 some awareness of issues and their wider significance.<br />40 - 49 limited awareness of issues and their wider significance.<br />Below 40 very limited awareness of issues and of their wider significance.'
            }
        });
    });

</script>

</body>
</html>

Answer 1

嗯，看來您的JavaScript某處有問題，您將必須查看控制台消息以查看出了什么問題。

無論如何，在發表任何評論或完整解決方案之前，我希望先查看完整的HTML和代碼。 但是，根據您的要求以保持簡單並確保正確記錄更改日期，我們必須遵循以下方法。

     $("#id_submission_date").datepicker({
        onSelect: function(dateText) {
         console.log(dateText);
        }
     });

此處的“ dateText”應包含所需的選定日期。 檢查您的瀏覽器控制台。 但是，如果有錯誤，將顯示正確的錯誤。

一旦獲得適當的日期，就可以進行比較。

如果發生錯誤，請在此處發布錯誤消息，我們可以討論更多。

jQuery Datepicker中的onSelect事件似乎沒有觸發

問題描述

1 個解決方案

解決方案1
0 2014-04-27 10:38:42

jQuery Datepicker中的onSelect事件似乎沒有觸發

問題描述

1 個解決方案

解決方案1 0 2014-04-27 10:38:42

解決方案1
0 2014-04-27 10:38:42