提问人:Christopher Bruce 提问时间:3/13/2018 更新时间:3/13/2018 访问量:31
将“DOM Waiter”转换为命名空间侦听器?
Convert "DOM Waiter" to namespacing listener?
问:
因此,我在 SharePoint 网站上安装了一个设计框架,我用它来动态插入文件列表,用户无需执行任何操作或单击任何按钮即可加载列表。但是,结果中的日期不会被格式化。
与此同时,我在另一个用户的帮助下提出了以下解决方案,该解决方案在加载之前检查 DOM,然后使用 MomentJS 执行重新格式化日期值的操作:
var timeout = null;
function waitForDom () {
console.log("Checking DOM...");
// check for the elements you expect to exist
if ($(".shortpoint-listitem-subtitle").length) {
$(".shortpoint-tab-title").click(function() {waitForDom();});
clearTimeout(timeout);
formatDates();
}
else {
// adjust timeout time to whatever feels appropriate to you
timeout = setTimeout(waitForDom, 500);
}
}
waitForDom();
function formatDates() {
$('.shortpoint-listitem-subtitle, .shortpoint-listitem-description').each(function() {
var currentElement = $(this);
var value=currentElement.text();
var dateParseRegex = /\d\d\d\d[-]\d\d[-]\d\d[T]\d\d[:]\d\d:\d\d[.]\d{7}[Z]/g;
var formattedDate = value.replace(dateParseRegex, function (match) {
return moment(match).format("MMMM Do YYYY, h:mm:ss a");
});
currentElement.text(formattedDate);
});
}
setTimeout(function () {
var content = '';
$(".content").append(content);
}, 2300);
它有效,但性能不是超级强。我联系了该公司,问我如何才能连接到更同步的东西,他们的建议是“像”听jQuery事件”。所以就我而言,事件将是.shortpoint-init[ShortPoint Name]
shortpoint-initfiles-list
但是,在查看了 jQuery 事件示例之后,我不太知道如何设置它,以便 jQuery “侦听”这些“事件”发生在文档/页面上,以便它以一种比等待 DOM 更流畅的方式运行代码。大多数事件似乎是响应式的,也就是说,它们等待用户的输入,例如单击。
我想我正在寻找但仍然不知道如何将这段代码重新加工成它。namespacing events
我没有将此代码放在 or 和其他类似代码中的原因是数据是不同步加载的,因此即使文档/正文已准备就绪,数据/DOM 也不存在。document ready
document load
这不应附加到任何类型的点击事件/操作。
答:
1赞
T.J. Crowder
3/13/2018
#1
您不是在寻找命名空间事件。你只想把事件挂在:document
$(document).on("shortpoint-initfiles-list", function(e) {
// Here, `e.target` will be the element the event was fired on
});
我假设这些事件是泡沫。我试图在他们的知识库中查找它,但似乎没有任何像 API 参考这样愚蠢的东西(或者他们很好地隐藏了它)。
评论
0赞
Christopher Bruce
3/13/2018
所以我只是把我的 formatDates 代码扔到那个函数的主体中?
0赞
T.J. Crowder
3/13/2018
@ChristopherBruce:假设只有一个列表,是的。否则,我猜你需要用它来弄清楚事件来自哪个列表。e.target
0赞
Christopher Bruce
3/13/2018
好吧,很酷,这很有效。我在这里确实有另一个有趣的问题,在您单击它们之前,其他选项卡中没有任何数据,此时 div 中的内容会发生变化。但是,日期不会格式化,但是如果我单击页面上某处的另一个元素,则日期格式会更新。有没有好的解决方案?我意识到此内容的设置非常卡顿。如果需要,我可以更新我的问题以进一步澄清。
0赞
T.J. Crowder
3/13/2018
不知道,您可能需要向公司开一张票,询问有关这些事件的详细信息,何时以及如何提出等。
1赞
Christopher Bruce
3/13/2018
啊,我想我使用了错误的事件处理程序,并且在代码中的错误位置进行了尝试,我最终在您的代码之后使用了它,现在一切正常。$(document).on(“点击”, “.shortpoint-tab-title”, function () { formatDates();再次感谢。
评论