2013-10-08 6 views
-1

Мне очень нужна помощь в расчете разницы между двумя датами, и это должно быть количество дней в целом числе. Вот мой HTML и jQuery ..Расчет разницы между датами с использованием запроса

Это совсем не работает ... Сайт должен сказать дату сегодня. Затем пользователь будет выбирать дату и нажать кнопку «Проверить нашу учетную запись безопасности», а внизу страницы - сколько дней прошло. JQuery:

$(document).ready(function() { 
    $('#safetyRecord').hide(); 

var monthNames = [ "January", "February", "March", "April", "May", "June", 
"July", "August", "September", "October", "November", "December" ]; 
var dayNames= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"] 

var newDate = new Date(); 
newDate.setDate(newDate.getDate());  
$('#today').html(dayNames[newDate.getDay()] + "," +' ' + monthNames[newDate.getMonth()]  + ' ' + newDate.getDate() + ","+ ' ' + newDate.getFullYear()); 

/* 
$(':button').click(function(){ 
var start = $('#dateOfLastAccident').val(); 
var end = $('#today'); 

var startDate = new Date(start); 
var endDate = new Date(end); 

var diff = endDate - StartDate; 

var numDays = Math.floor(diff/1000 /60 /60 /24); 
$('#daysSinceLastAccident'+ numDays)(); 
*/ 
}); 

HTML-:

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>generic safety</title> 

    <link rel="stylesheet" href="L3hw.css"> 

    <!-- jQuery library hosted by Google Content Distribution Network --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
    <script src="L3hw.js"></script> 

</head> 
<body> 
    <header> 
     <img src="images/genericBanner.png" alt="Generic, Inc."> 
     <p> 
      The New Ventures Mission is to scout profitable growth opportunities in 
      relationships, both internally and externally, in emerging, mission-inclusive 
      markets, and explore new paradigms and then filter and communicate and 
      evangelize the findings. 
     </p> 
    </header> 

    <section id="main"> 
     <h1>Safety at generic company</h1> 
     <h2>Today is <span id="today">TBD</span>.<br> 
      Our last lost-work accident was on 
      <input type="date" id="dateOfLastAccident"> 
      <button type="button" id="checkRecord">Check our safety record</button> 
     </h2> 
     <h2 id="safetyRecord"> 
      It has been <span id="daysSinceLastAccident">TBD</span> days since our last lost-work accident. 
     </h2> 
    </section> <!-- end main --> 

    <footer> 
     <p id="message"> 
      <!-- (an appropriate safety message will appear here) --> 
     </p> 
     <p><img src="images/genericBullet.png" alt="*"> Generic Company - we do stuff</p> 
    </footer> 
</body> 
</html> 
+2

ВСЕ ЦИФРЫ КАК ОБРАТИТЬСЯ ... ПОЖАЛУЙСТА, НЕ БЫВАЙТЕ !!! – tjons

+2

Это может дать вам некоторое представление ':)' http://stackoverflow.com/questions/10931288/how-to-add-subtract-dates-with-javascript/10931362#10931362 –

+0

жаль, что я никогда не использовал этот сайт, я пытался отделить его от кода. И я не использую datepicker, я просто использую тип ввода = date в html. – user2856563

ответ

0

Я хотел бы предложить, что вы используете DatePicker, и что вы переосмыслить, почему вы программирования. Если вы не используете правильный инструмент, потому что он не требуется, вы не должны программировать.

Я чувствую, что я не должен делать свою домашнюю работу, но ... вот это грубая идея (в обычном JS, не JQuery):

function funC(){ 
//here is the date today... 
var d=new Date(); 
var i = getElementById("today")' 
i.InnerHTML= d; 
//here is a function for the days since the date 
var e = getElementById("dateOfLastAccident"); 
var x = d-e; 
var y = //insert your own algo to format dates 
var a = getElementById("daysSinceLastAccident"); 
a.InnerHTML = y; 
} 

ОБРАТИТЕ ВНИМАНИЕ, ЧТО ЭТО НЕ БУДЕТ РАБОТАТЬ ПО САМ. ТЫ ВСЕ ЕЩЕ РАБОТАЕТ. И ДА, Я СКАЗАЮ !!!

+0

спасибо, я не прошу ответа ... просто помогите – user2856563

+0

Если бы это помогло, не могли бы вы пропустить большую зеленую проверку, чтобы принять мой ответ? Это не повредит, обещаю ... – tjons

+0

Большое спасибо – tjons

3

Хотя jQuery восполняет многие недостатки Javascript, и хотя поддержка Date - одно из недостатков Javascript, jQuery не поможет вам с датами. Итак, вы выбрали неправильный инструмент для работы, как это отметили многие другие.

jQueryUI DatePicker будет делать многое из этого для вас, если вы используете его так, как он был предназначен (чтобы показать дампикера), и делаете плохую работу по выполнению части этого для вас, например, просто вычисляйте дни между датами, потому что это слабо разлагается.

Я присоединяюсь к другим в вопросе, почему вы не используете это - возможно, вы просто не знали, что это существует, или что вы заметили, что это немного монстр и не чудесно написан. Это действительные обвинения, но я предупреждаю вас, что даты и календари - одна из многих известных разработчиков Pits of Despair. Смертельная область, в которой люди думают о чем-то простом, а компьютеры и реальность отбрасываются назад, после того, как вы закодировали свой путь в деталях, когда очень много, слишком поздно, чтобы сократить свои потери и почувствовать себя хорошо.

Если беспорядок вы в это не достаточно, чтобы убедить вас в том, что все плохо, когда вы получаете в сроки и форматирования даты и будет только хуже, вот часть an old Quora answer of mine:

Например, если вы скажете мне, что все кавычки в системе истекают через 10 дней, я могу сказать, что это хорошо, это просто и оценить, что срок действия истечения составляет час. Если бы я оценил неделю для этого, ты бы назвал меня сумасшедшим.

Затем я пытаюсь его закодировать. Когда они истекают, в полночь или время их предоставления? Как мне их закончить - я пишу работу, которая постоянно просыпается и заканчивает старые кавычки? Подождите, пока пользователи будут проверять их и истекают старые кавычки там, пока я заставляю пользователя ждать?

Затем я выясню, что это фактически 10 рабочих дней. Какой рабочий день? Как правильно настроить дату, чтобы пропустить выходные? Каков график праздников? Как насчет високосных лет? Когда это високосный год? (подсказка: это не каждые 4 года. Это не каждые 4 года, за исключением каждых 100.)

ОК, мы построим интерфейс для вас, чтобы сохранить график отпуска, так как он может быть изменен.

Затем я узнаю, что вы хотите, чтобы пользователь получал предупреждающее письмо за день до истечения срока действия котировки. Не день, рабочий день. В их часовом поясе. Удостоверьтесь, что он отключается только в рабочее время, когда они есть.

КАК ЧАСТЬ ПЕРВАЯ НА 2 недели?

Так что сократите свои потери. Используйте jQueryUI Datepicker.

0

Ya, почему бы вам не использовать datepicker? Я не знаю, как вычислить строку с форматированием даты в javascript, но я знаю, что мы можем вычислить строку с форматированием даты в PHP. Итак, если вы хотите использовать jquery, вы также должны использовать ajax. (я не использую DatePicker, поэтому вставить дату вручную) Это PHP:

<?php 
$datefr = strtotime($_REQUEST['datefr']); 
$dateto = strtotime($_REQUEST['dateto']); 

$result = ($dateto-$datefr)/(3600*24); //convert 'secon' to 'day' 

echo $result; 
?> 

Это HTML:

<script type="text/javascript" src="jquery-1.9.1.js"></script> 
<script> 
function calculate(){ 
var datefr = $("#datefr").val(); 
var dateto = $("#dateto").val(); 

$.ajax({ 
url : "caculate.php", 
type: "POST", 
data : "datefr="+datefr+"&dateto="+dateto, 
success : 
function (data){ 
$("#result").val(data); 
} 
}); 

} 
</script> 
<input type="text" id="datefr"><input type="text" id="dateto"> 
<input type="button" onclick="calculate()" value="Calculate"> 
<br> 
<input type="text" readonly id="result">day(s) 

Попробуйте это, вы увидите результат!
(обе даты, который будет вставлен должен находиться в «гггг-мм-дд» или «дд-мм-гггг» формат)

+0

Кажется, немного полезно использовать PHP и ajax для этого. –

+0

Это просто ссылка. : D –

1

Во-первых, вам нужно выяснить, что «разница в днях» означает, например

2013-10-11T00:00:01 - 2013-10-10T23:59:59 => 1 day or 2 seconds? 

Разница в днях довольно просто, используя значения UTC, если вы можете игнорировать компонент времени:

// Expects ISO8601 format yyyy-mm-dd 
function toUTCDate(s) { 
    s = s.split(/\D/g); 
    // Re-order arguments for other formats 
    return new Date(Date.UTC(s[0], --s[1], s[2])); 
} 

function daysDiff(dateString) { 
    var msInDay = 8.64e7 
    var now = new Date(); 
    var nowUTC = Date.UTC(now.getFullYear(), now.getMonth(), now.getDate()); 
    return (nowUTC - toUTCDate(dateString))/msInDay; 
} 

console.log(daysDiff('2013-09-30')); // 8 for 8 October 2013 

Если у вас есть две даты строки, то daysDiff функция может быть столь же просто, как:

function daysDiff(d0, d1) { 
    return (toDate(d1) - toDate(d0))/8.64e7; 
} 
0

Следует ли использовать средство выбора даты, да. Вам нужно, нет. С помощью Google Chrome и предоставленного вами HTML (input type='date') вы получаете один бесплатно. Прокомментированный код, который вы предоставили, очень близок к тому, что вам нужно. Я не собираюсь давать вам ответ, но даю вам указатели, видя, что это домашнее задание и все такое.

$(':button').click(function(){ 
var start = $('#dateOfLastAccident').val(); 
var end = $('#today'); //Perhaps use what you used to popluate #today,this code won't get text or value, just an object 

var startDate = new Date(start); 
var endDate = new Date(end); 

var diff = endDate - StartDate; //javasctipt is case sensative 

var numDays = Math.floor(diff/1000 /60 /60 /24); 
$('#daysSinceLastAccident'+ numDays)(); //not how jQuery sets text: http://api.jquery.com/text/ 
//dont forget to show what is hidden: http://api.jquery.com/show/ 

Это голые кости, но вам нужно добраться туда, куда вам нужно.

Также узнайте об отладке javascript, используя предупреждения для отладки или еще лучше регистрируясь на консоли для отладки, где находится консоль javascript (подсказка в chrome f12 - ваш друг).

Смежные вопросы