草庐IT

javascript - jQuery timeago 用法

coder 2024-07-22 原文

我有一个 <abbr>在我的 HTML 中使用类“timeago”标记。当我在页面加载时设置它的值时，然后调用 jQuery("abbr.timeago").timeago();在文档就绪功能上它可以工作。

我的问题是，如果我从一些 javascript 函数中动态更改 abbr.timeago 标题，我怎样才能让 timeago 插件在更新的 abrr.timeago 元素上发挥它的魔力？

我应该调用哪个函数？我应该删除 jQuery("abbr.timeago").timeago(); 吗？从文件准备功能或离开它？谢谢

编辑问题:

@squiddy 示例有效，仅更新时间一次，并且保持不变。例如，如果我将 timeago 放到当前时间 .. 那么它就好像它没有改变一样？

赏金更新:

请忽略之前的问题。在我的网站上有一个链接，点击它会调用 getJSON 函数，它将一些信息从服务器获取到一个表中。

每一行代表来自服务器的反馈。这是我的 getJSON 伪代码:

            $.getJSON("feedback/" + feedbackId, function(data) {
            var column ... declared variable in which column selector
        .... some logic that populates table(irrelevant)
            //Store last checked time in title
        column.attr("title", iso8601(new Date()));
            //invoke timeago on this title
        column.html(jQuery.timeago(iso8601(new Date())));
            ....iso8601 is date format function
    });

因此，对于我从服务器获得的每个反馈(n 次)，都会调用此 getJSON。当 json 完成时，表中的相应列将填充上次更新时间。

但似乎timeago 并没有读取更改后的title 值，它不识别更新的DOM。我为来自服务器的每个反馈放置了一个 console.log(element.attr("title")) 用于调试目的，只是为了查看我是否将 title 属性设置为当前时间，它确实如此，但 timeago 获取了最初加载的标题值(value)。

我该怎么办我也试过这个版本:

$.getJSON("feedback/" + feedbackId, function(data) {
                var column ... declared variable in which column selector
            .... some logic that populates table(irrelevant)
                //Store last checked time in title
            column.attr("title", iso8601(new Date()));
                //invoke timeago on this title

                $(column).livequery(function() {
                $(this).timeago(iso8601(new Date()));
                console.log($(this).attr("title"));
            });  
        });

我花了几个小时尝试了几种可能的解决方案..比如每 n 秒调用一次函数来调用 timeago 函数，但结果总是相同

最佳答案

更新 2:同样的技巧在这里起作用。元素 column 之前被 timeago 转换过一次，当发生这种情况时，timeago 在该元素上放置了一个“timeago”数据字段。当这个数据字段存在时，timeago 不会打扰它，所以你必须清除它。代码看起来像这样:

$.getJSON("feedback/" + feedbackId, function(data) {
    var column 
    // ... declared variable in which column selector
    // ... some logic that populates table(irrelevant)
    // Store last checked time in title
    column.attr("title", iso8601(new Date()));
    // invoke timeago on this title
    column.data("timeago",null).timeago();
    // ... iso8601 is date format function
});

更新: 更正，测试，诀窍是，timeago 插件标记已经转动的元素，不要让它们再次转动，除非标记被清除

当您更改 abbr.timeago 中的值时，您应该再次仅对该元素运行 timeago() 函数。我会为此推荐一些功能:

$.fn.changeTimeago = function(isotime) {
    return $(this).attr("title",isotime).data("timeago",null).timeago();
}

// usage:
$("abbr.timeago").changeTimeago("2004-07-17T09:24:17Z");

希望这就是您所需要的!

关于javascript - jQuery timeago 用法，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4899251/

用法javascripttimeagocolumntitlejquery

有关javascript - jQuery timeago 用法的更多相关文章

  1. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  2. ruby - 有人可以解释一下在 Ruby 中注入(inject)的真实、通俗易懂的用法吗？ - 2

    我正在学习Ruby，遇到了inject。我正处于理解它的风口浪尖，但当我是那种需要真实世界的例子来学习一些东西的人时。我遇到的最常见的例子是人们使用inject来添加一个(1..10)范围的总和，我不太关心这个。这是一个任意的例子。在实际程序中我会用它做什么？我正在学习，所以我可以继续使用Rails，但我不必有一个以Web为中心的示例。我只需要一些我可以全神贯注的目标。谢谢大家。 最佳答案 inject有时可以通过它的“其他”名称reduce更好地理解。它是一个对Enumerable进行操作(迭代一次)并返回单个值的函数。它有许多有

  3. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  4. ruby - 使用法拉第上传文件 - 2

    我在尝试使用Faraday将文件上传到网络服务时遇到问题。我的代码:conn=Faraday.new('http://myapi')do|f|f.request:multipartendpayload={:file=>Faraday::UploadIO.new('...','image/jpeg')}conn.post('/',payload)尝试发布后似乎没有任何反应。当我检查响应时this是我所看到的:#:post,:body=>#,#,@opts={}>,#],@index=0>>,#>],@ios=[#,#,@opts={}>,#],@index=0>,#],@index=0>

  5. ruby - rspec: raise_error 用法来匹配错误信息 - 2

    我使用raise(ConfigurationError.new(msg))引发错误我试着用rspec测试一下:expect{Base.configuration.username}.toraise_error(ConfigurationError,message)但这行不通。我该如何测试呢？目标是匹配message。 最佳答案 您可以使用正则表达式匹配错误消息:it{expect{Foo.bar}.toraise_error(NoMethodError,/private/)}这将检查NoMethodError是否由privateme

  6. 【ChatGPT】ChatGPT 的 N 种用法 - 2

    目录ChatGPT简介技术原理应用未来发展ChatGPT的10 种用法ChatGPT简介ChatGPT是一种基于深度学习的大型语言模型，由OpenAI公司开发。技术原理GPT是GenerativePre-trainedTransformer的缩写，意为生成式预训练变压器。它的技术原理是使用了一个基于注意力机制的变压器（Trans

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  9. ruby - 是否有 Rack::Session::Cookie 用法的基本示例？ - 2

    我找不到任何使用Rack::Session::Cookie的简单示例，并且希望能够将信息存储在cookie中，并在以后的请求中访问它并让它过期.这些是我能找到的唯一示例:HowdoIset/getsessionvarsinaRackapp?http://rack.rubyforge.org/doc/classes/Rack/Session/Cookie.html这是我得到的:useRack::Session::Cookie,:key=>'rack.session',:domain=>'foo.com',:path=>'/',:expire_after=>2592000,:secret=

  10. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因，我必须为Firefox禁用javascript(手动，我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点？ 最佳答案 是的，这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

随机推荐