In working with timestamps, moment.js, and the provided example of implementation by founddrama, I added the following to my html site:
<span id="then" data-date="Aug 22 2018 11:33:00 GMT-0700 (PDT)"></span>
<script>
$(document).ready(function(){
var then = $('#then'),
date = moment(new Date(then.attr('data-date'))),
update = function(){
then.html(date.fromNow());
};
update();
setInterval(update, 60000);
});
</script>
The output result was successful.
I would, however, like to add multiple timestamps.
In order to successfully render, I coded in this manner:
<span id="then" data-date="Aug 18 2018 07:33:00 GMT-0700 (PDT)"></span>
<span id="then1" data-date1="Aug 3 2018 16:33:00 GMT-0700 (PDT)"></span>
<script>
$(document).ready(function(){
var then = $('#then'),
date = moment(new Date(then.attr('data-date'))),
update = function(){
then.html(date.fromNow());
};
update();
setInterval(update, 60000);
});
</script>
<script>
$(document).ready(function(){
var then = $('#then1'),
date = moment(new Date(then.attr('data-date1'))),
update = function(){
then.html(date.fromNow());
};
update();
setInterval(update, 60000);
});
</script>
I am looking for a clean, concise way to properly group the javascript code, and place within one script block, instead of two.
This will find all DOM elements with the class then and then find each of their data-date attributes and set their inner HTML to a moment.js object.
<span class="then" data-date="Aug 22 2018 11:33:00 GMT-0700 (PDT)"></span>
<span class="then" data-date="July 15 2018 9:33:00 GMT-0700 (PDT)"></span>
<script>
$(document).ready(function(){
var dates = $('.then');
$.each(dates, function(){
var date = moment(new Date($(this).attr('data-date')))
$(this).html(date.fromNow());
})
});
</script>
First provide the class name to span elements.
Then parse to each span elements.
Make data attribute common i.e. data-date and not different for each span.
Then parse through all the span and append the html.
<span class="then" data-date="Aug 18 2018 07:33:00 GMT-0700 (PDT)"></span>
<span class="then" data-date="Aug 3 2018 16:33:00 GMT-0700 (PDT)"></span>
<script>
$(document).ready(function(){
$('.then').each(function(i) {
var $this = $(this);
var date = moment(new Date($this.attr('data-date')));
var update = function() {
$this.html(date.fromNow());
};
update();
setInterval(update, 60000);
});
});
</script>
Related
I have this code below and I am trying to add html before and after a span which has no id.
I can only select it with the :contains selector.
Using this selector, how can I add my elements?
var tel = $('span:contains("+33 (0)1 02 03 04 05")');
var telText = tel.text();
var newTel = '' + telText + '';
tel.html(newTel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js">
<span>phone number</span>
<span>+33 (0)1 02 03 04 05</span>
It works here, you just have to use contains on the text that is inside the span.
var tel = $('span:contains("+33 (0)1 02 03 04 05")');
var telText = tel.text();
var newTel = '' + telText + '';
tel.html(newTel);
console.log(telText)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<span>phone number</span>
<span>+33 (0)1 02 03 04 05</span>
This script using warp.js works great starting from the current date. I can't seem to figure out how to get it to work starting from a previous date like Jan 2nd, 1986?
warp.js
https://github.com/mattbradley/warpjs/blob/master/README.md
Thanks!
<body>
<script src="warp.js"></script>
<div id="container"></div>
<span id="info"></span><br>
<span id="time"></span>
<span id="time2"></span>
<script>
setInterval(function() {
//specify a start date here like Jan 2 1986
Date.warp.speed(3);
var now = new Date;
//new date put out the warped start date above?
var dateD = [now.getMonth() + 1, now.getDate(), now.getFullYear()];
var dateE = [now.getHours(), now.getMinutes(), now.getSeconds()];
var MDY = dateD.join("/");
var HMS = dateE.join(":");
time.innerHTML = (MDY);
time2.innerHTML = (HMS);
}, 1000);
</script>
</body>
</html>
I figured this out. You have to use the clock() function so set your custom date, and it will then warp from that custom date.
Date.warp.clock(customDate);
I want to format a timestamp such as 1406270888 to Sunday, July 25, 2014 12:48:08 PM in a WebView on android device.
My Javascript code is as follows:
<script>
var chatTimestamp=parseInt(1406270888);
var date = new Date(chatTimestamp*1000);
var localTime =date.toLocaleDateString()+ " "+ date.toLocaleTimeString();
document.getElementById("demo").innerHTML = localTime;
</script>
But the output I get is as follows:
Sunday, July 25, 2014 12:48:08
So Basically AM PM is missing.
Source: http://www.w3schools.com/jsref/jsref_tolocaletimestring.asp
Any help is appreciated.
Thanks
Try this script
<script type="text/javascript">
var chatTimestamp=parseInt(1406270888);
var date = new Date(chatTimestamp*1000);
document.write(date.toString());
document.write(date.getFullYear()+'-'+date.getMonth()+'-'+date.getDate()+' '+date.getHours()+':'+date.getMinutes()+':'+date.getSeconds());
</script>
Iep, i have a problem, its the first time that im working with cookies and i was trying to save them.
The question is that only the 2 first values are saved, in this case "nombre" and "tuValor". If i do "alert(document.cookie)" the other values dont apear.
<script type="text/javascript">
function guardar() {
Nombre = "Empire";
tuValor = "F"+food;
tuValor2 = "w"+wood;
caduca = "31 Dec 2020 23:59:59 GMT";
document.cookie = Nombre+"="+tuValor+tuValor2+"expire= "+caduca ;
}
</script>
You forgot the semicolon before expire.
It goes like this:
document.cookie="my_cookie=empireWh4t3v3r;expires=Thu, 23 Apr 2020 15:37:15 GMT;"
Hi i am using bootstrap datepicker. I need to get the value from datepicker text box in the format like date-month-year to my controller but presently i am getting values like
Tue Oct 01 00:00:00 IST 2013
I have tried formatting date but still i am getting same result . I have tried like below
$(function() {
window.prettyPrint && prettyPrint();
$('#birthday').datepicker({
format: "DD, d MM, yy"
})
});
If the format attribute is not working. You can try something similar to this:
var dt = $('#dt').datepicker({format:'dd/mm/yyyy'}).on('changeDate', function(ev) {
var newDate = new Date(ev.date);
var year = newDate.getFullYear();
var month = (newDate.getMonth()+1);
var day = newDate.getDate();
dt.setValue(day+'-'+month+'-'+year);
dt.hide();
}).data('datepicker');
You are formatting your date by yourself.
You can ignore the format attribute.