通过jquery调用函数并将结果输出到razor html中的div

Question

I'm working with twitter api and created_at property. Specifically i'm trying to get the timestamp to posted X seconds, minutes, hours, days, weeks ago.

I think i have the right function written, I'm just unsure how to call the function. I've attempted to put my own attribute on a div and use jquery to find that div. now i just need to know how to call the function.

<div style="text-align: left" data-utc="@Model.FullTweetData.CreatedAt"></div>

<script src="/javascript/jquery-2.0.3.min.js" type="text/javascript"></script>

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

        $("div[data-utc=@Model.FullTweetData.CreatedAt]")

        function parseTwitterDate(tdate) {
            var system_date = new Date(Date.parse(tdate));
            var user_date = new Date();
            if (K.ie) {
                system_date = Date.parse(tdate.replace(/( \+)/, ' UTC$1'))
            }
            var diff = Math.floor((user_date - system_date) / 1000);
            if (diff < 60) { return "less than a minute ago"; }
            if (diff <= 90) { return "one minute ago"; }
            if (diff <= 3540) { return Math.round(diff / 60) + " minutes ago"; }
            if (diff <= 5400) { return "1 hour ago"; }
            if (diff <= 86400) { return Math.round(diff / 3600) + " hours ago"; }
            if (diff <= 129600) { return "1 day ago"; }
            if (diff < 604800) { return Math.round(diff / 86400) + " days ago"; }
            if (diff <= 777600) { return "1 week ago"; }
            return "on " + system_date;
        }
        var K = function () {
            var a = navigator.userAgent;
            return {
                ie: a.match(/MSIE\s([^;]*)/)
            }
        }();
    });
</script>

any help would be great

Answer 1

get value of the attribute and store it in a variable:

var timeThing = $("div").attr('data-utc');

then call the function and pass the arg:

parseTwitterDate(timeThing);

I am going to guess that just selecting all divs is not going to give you the result you are looking for so you may consider attaching id's or classes to the divs to make sure you are selecting the right one:

HTML:

<div class="twitterDates" data-utc="@Model.FullTweetData.CreatedAt"></div>

Then you can select all divs with that class, iterate through each one and call the parse date function for each one.

js:

$('div.twitterDates').each(function(){
  var timeThing = $(this).attr('data-utc);

  parseTwitterDate(timeThing);  
});

also since you probably want the return value of the function put somewhere you might consider something like this:

$('div.twitterDates').each(function(){
  var timeThing = $(this).attr('data-utc);

  $(this).text(parseTwitterDate(timeThing));
});