fullcalendar:如何添加每天所有事件的总持续时间

2024-01-02

我注意到这个问题被问了几次,但没有实际的正确答案或良好的反馈来引导正确的道路。

我在用全日历 https://fullcalendar.io/javascript 插件并尝试添加每天多个事件的总小时数,然后我将在每天的页眉或页脚中显示总和。

我尝试了许多不同的方法来完成此任务,但最接近结果的是使用以下代码:

eventAfterRender: function(event, element, view) {

            if (event.totalhrs > 0) {
                var sd = event.startdate;

                if (dateTotal.hasOwnProperty(sd)) {
                    dateTotal[event.startdate] = (dateTotal[event.startdate] + +event.totalhrs);
                } else {
                    dateTotal[event.startdate] = +(event.totalhrs);
                }

                $(".fc-day-top[data-date='"+event.startdate+"']").find('.fc-dailytotal').text(dateTotal[event.startdate]);
            }

        }

这在第一次渲染日历时有效,但如果有事件更改,它会继续添加总计,错误地显示非常高的值。我明白为什么它错误地添加了总数(dateTotal[event.startdate] + +event.totalhrs)但我希望有人能帮助指导我朝着正确的方向取得正确的结果。

感谢任何反馈/帮助。


我想出了一种替代方法来完成这项工作,而无需使用包含每天总和的日期数组。我希望这对那些和我一样一直在寻找的人有所帮助。

请记住,此示例仅适用于月视图...需要进行一些调整才能使其适用于周/日视图。

此外,该活动还必须有一个总小时数对象用于求和。您将在下面看到这一点事件.totalhrs

viewRender: function(view, element) {
  $.each($(".fc-day-top"), function(key, val) {
    var dateYMD = $(this).attr("data-date");
    $(this).append("<div class='fc-dailytotal' id='dailytotal-"+dateYMD+"'></div>");
  });
},

eventRender: function(event, element, view) {
    $(".fc-dailytotal").text(0); //Clear total sum
},

eventAfterRender: function(event, element, view) {
    var currentday = moment(event.start).format("YYYY-MM-DD");

    if (event.totalhrs > 0) {
      var prev = $("#dailytotal-"+currentday).text() || 0;
      $("#dailytotal-"+currentday).text(+prev + +event.totalhrs);
    }
}

您也可以使用此方法来计算每周总计。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

fullcalendar:如何添加每天所有事件的总持续时间 的相关文章

  • 我如何在ajax应用程序中找到未使用的css?

    我一直在搜索 但找不到任何 ff 插件或 javascript 来查找 ajax 应用程序中未使用的 css 除尘选择器 http www sitepoint com dustmeselectors 可以进行网站抓取 但我正在寻找检查加载内
  • GraphQL:从对象构建查询参数

    如果我有一个对象 where publishedAt lt 2018 01 01 如何将其转换为适合查询参数的字符串 articles where publishedAt lt 2018 01 01 这看起来是一个有趣的库 我建议检查一下
  • 可以在 iPad 上自动播放 HTML5 视频吗?

    The
  • 如何告诉 Sonar 使用我的可靠报告来获取单元测试结果

    我们有一个 Jenkins 作业 其中包含一堆 javascript 文件 我们通过 grunt 构建项目 并在构建结束时运行 JSCover 来运行单元测试并收集代码覆盖率 这一切都有效 我们得到了一个不错的 LCOV 文件 并且在 ta
  • Karma Webpack - 错误:找不到模块“./test/utilities.js”

    我正在使用 Karma Webpack 进行项目的单元测试 当我跑步时karma start 我有这个错误 Error Cannot find module test utilities js at myproject test campa
  • Puppeteer 登录 Instagram

    我正在尝试使用 Puppeteer 登录 Instagram 但不知何故无法登录 你能帮助我吗 这是我正在使用的链接 https www instagram com accounts login https www instagram co
  • JavaScript - babel-preset-env 不为 IE11 转换箭头函数

    我很难尝试配置 Babel 来转译 IE11 可以理解的代码 特别是箭头函数 跑步npx webpack mode development使用我的配置不会转换我的代码中的箭头函数 在eval 在生成的代码中的语句中 我可以看到所有实例都未转
  • 闭包和异步 Node.js 函数

    All 尝试了解 Node js 上下文中的闭包 异步调用 我有以下代码 timer setInterval pollOID 1000 function pollOID for channel in channels session get
  • Angularjs 使用 ng-init 为 ng-model 赋值

    您好 我有以下问题 看起来很简单并且应该有效 但事实并非如此 在我的代码中我输入了
  • Array.from 的时间复杂度

    时间复杂度是多少Array from 例如 const set new Set set add car set add cat set add dog console log Array from set time complexity o
  • pointdown 与 onclick:有什么区别?

    两者有什么区别onpointerdown and onclick事件处理程序 有任何实际差异吗 事件在 DOM 树上传播的方式不一样吗 是否有一些设备仅响应这些事件之一 我最初以为这只是pointerdown在触摸设备或笔中触发 但是onc
  • 如何在Javascript中保存zip文件的二进制数据?

    我从 AJAX 响应中收到以下响应 这是 zip 文件的响应 请让我知道如何在 Javascript 中保存此 filename zip ZIP 里面有 PDF 文件 我的代码是这样的 ajax url baseURLDownload se
  • 如何在反应路由器的登录页面中隐藏导航栏

    我想隐藏登录页面中的导航栏 我确实做到了 但我在其他页面上看不到导航栏 此代码是 My App jsx 文件的一部分 我在 App 的状态中创造了历史 当路径名是 或 login 时 我会隐藏导航栏 有用 但随后我输入了 ID 和密码 然后
  • 如何在 Electron 中使窗口大小响应。 (打开应用程序时)

    我最近开始在 Electron 上制作一个应用程序 我想让窗口具有响应能力 例如 如果我在不同的屏幕上打开应用程序 它应该根据屏幕尺寸以全尺寸打开 我的代码 app on ready gt const htmlPath path join
  • 将变量从一个 jsp 发送到另一个 jsp

    我有一个 JSP 文件jsp 1 jsp和另一个 JSP 文件jsp 2 jsp 我已经包括了jsp 2 jsp in jsp 1 jsp using 现在我需要某个元素上的单击事件 在该事件中 我想将字符串变量传输到包含的 jsp 中 假
  • jQuery 分钟和秒倒计时器

    我想创建一个 jquery 倒计时器 我尝试了以下代码 但它不起作用 我该怎么办 DEMO https jsfiddle net tbosn210 https jsfiddle net tbosn210 var interval setIn
  • 如何使用 $.ajax 发送 JSON 而不是查询字符串?

    有人可以简单地解释一下如何让 jQuery 发送实际的 JSON 而不是查询字符串吗 ajax url url dataType json I was pretty sure this would do the trick data dat
  • 如何在从数据库异步加载中用占位符替换不存在的图像

    我有一个包含图像的数据库 我需要根据用户的请求即时加载这些图像 这些图像将作为包含 div 容器中的单独 s 的背景图像 类似于图像滚动条 该数据库当前是本地数据库 但这不是我的问题 问题是数据库可能没有我请求的所有图像 并且我可能会得到一
  • 删除移动设备上的 adsense

    我正在研究响应式设计 但在使用 adsense 时遇到了问题 我有一个广告应该显示在桌面设计上 但不能显示在移动设计上 因此 只有在桌面上查看网站时 才应将广告代码放置在 html 中 css 可以使用 display none 但这违反了
  • 离子选择:预选值在单击一次之前是不可见的

    我刚刚在 ionic 版本 6 中创建了一个 ion select 我的问题是 我在页面加载时已成功预选了一个值 但此预选值未显示在 UI 中 它只是在我单击选择之后出现 但在它没有出现之前 如图 2 所示 我在 ionViewWillEn

随机推荐

  • AttributeError:模块“matplotlib.pyplot”没有属性“axline”

    我有个问题 这是文档 https matplotlib org stable gallery pyplots axline html sphx glr gallery pyplots axline py https matplotlib o
  • 如何判断我的“IDisposable”类型何时尚未显式处置?

    It s 很难找到 https stackoverflow com questions 3097145 resharper custom search pattern to warn idisposable objects在设计 编译时类型
  • 内容的右边缘被居中 div 中的垂直滚动条覆盖

    我想创建一个居中弹出窗口 其中包含标题和其下的一张或多张卡片 每张卡片都包含一个小桌子 当卡片数量超出可显示范围时 会出现垂直滚动条 但有一个问题 垂直滚动条覆盖了卡片的右边缘 该行为取决于浏览器 Chrome 刷新页面时出现此问题 调整页
  • 有没有办法让 VS code 与 git worktree 一起工作? (带有 WSL 的 Windows)

    我喜欢在多个工作树中继续签出存储库git worktree轻松地同时在不同的分支上工作 然而 当 git 位于 git worktree 文件夹中时 VS code 似乎无法将 git 识别为 scm 我在文档中找不到有关此内容或扩展的任何
  • 更新框架按钮在 Xcode 8.1 中消失

    更新到 8 1 8B62 后 界面生成器右下角的 解决自动布局问题 快捷方式中不再有用于更新情节提要 xib 中的框架的按钮 我听说过要在新奇的触摸栏上放置这样一个按钮 但这对于像我这样的凡人来说意味着什么 我必须开始使用菜单栏吗 Now
  • Azure CLI 2:如何在 az group deployment create 命令中提供参数?

    我在 Windows 计算机上使用 Azure CLI 2 0 并尝试使用以下命令创建 Docker VMthis https learn microsoft com nl nl azure virtual machines virtual
  • autoindent 是 vim 中 smartindent 的子集吗?

    帮助自动缩进 开始新行时从当前行复制缩进 键入 在插入模式下或使用 o 或 O 命令时 帮助智能缩进 开始新行时进行智能自动缩进 适用于 C 类语言 程序 但也可用于其他语言 通常 使用 smartindent 时也应启用 autoinde
  • 多模块项目中的 Spring 配置

    我是 Spring 新手 遇到了一种情况 即单个项目具有多个模块 包括一个 Web 模块 Web模块使用Spring MVC 但我想知道是否可以在项目级别拥有主要的Spring配置来照顾整个项目 以便我可以充分利用Spring框架 main
  • 使用 getServerSideProps 获取内部 API? (下一个.js)

    我是 Next js 的新手 我正在尝试理解建议的结构并处理页面或组件之间的数据 例如 在我的页面内home js 我获取一个名为的内部 API api user js它从 MongoDB 返回一些用户数据 我正在通过使用来做到这一点fet
  • C++ 中头文件的保护块是什么?

    我正在尝试使用 Code Blocks IDE 创建一个 C 类 并且有一个名为 Guard block 的字段 我进行了搜索 但未能找到任何有用的信息 这个字段有什么用 谢谢 保护块用于防止同一编译单元 c 文件 多次包含头文件 它们看起
  • 如何在C++应用程序中使用curl Nuget包

    我正在尝试在使用 Visual Studio 2017 开发的 C 应用程序中使用curl 我喜欢使用 Nuget 的想法 因为它是实现库的一种非常干净的方式 我尝试遵循 Microsoft 论坛中的以下示例 这导致我使用 rmt curl
  • Android Studio gradle 构建问题:局部变量类型不匹配

    当我试图在互联网上找到解决方案时 但与我的情况没有太多相关 接下来的问题是 构建失败并出现错误 错误 未捕获的翻译错误 com android dx cf code SimException 局部变量类型不匹配 尝试使用 int 类型的局部
  • 向NavigationBar的titleview添加按钮,无需重复代码

    为了提供一些背景知识 我正在制作一个基于 UINavigationControlled 的博客类型应用程序 我认为它最类似于 iPhone 的 facebook 应用程序 无论当前处于活动状态的视图如何 导航栏都会在其标题区域中显示一些按钮
  • 我想将页面生成为没有分页符的单个 pdf 文件

    嗨 我想生成一个pdf大页面作为一个文件 没有分页符 下图显示了下载时的分页符 我想避免 想下载为单页 问题 我不想在下载时将页面拆分为多个页面 但想要一个单页 这是我的工作示例的样子代码沙盒演示 https codesandbox io
  • Databricks 更改默认目录

    似乎当我连接到 Databricks Warehouse 时 它 使用的是默认目录hive metastore 有没有办法将统一目录定义为默认目录 我知道我可以运行查询 USE CATALOG MAIN 然后当前会话将使用unity cat
  • 通过引用返回 std::vector 导致分段错误[重复]

    这个问题在这里已经有答案了 我有一个创建非常大的 std vector 的函数 返回此向量时 由于其大小 我不想再次复制它 因此 我想返回对该向量的引用 然而 这样做会给我带来分段错误 为什么是这样 解决办法是什么 这是我的代码 std v
  • C DLL 无法在 C# 中加载

    我有一个简单的 C DLL 不是 COM 我还有一个运行它的 C 2 0 应用程序 dllimport 该dll被放置在应用程序的exe中 我知道该 dll 没问题 而且我的应用程序调用它成功读取了它 但是当我将它们移动到另一台计算机时 它
  • 强制显式删除 Java 对象

    我正在开发一个处理大量非常密集流量的 Java 服务器 服务器接受来自客户端的数据包 通常为数兆字节 并将它们转发给其他客户端 服务器从不显式存储任何传入 传出数据包 然而服务器不断遇到OutOfMemoryException例外情况 I
  • 操作完成工作后执行函数

    大家好 今天开始使用 Redux 因此正在构建一个非常基本的项目 通过单击 递增 递减 按钮来递增 递减数字 这是一个小代码 请看一下 操作 创建文件 export const increment num gt return type in
  • fullcalendar:如何添加每天所有事件的总持续时间

    我注意到这个问题被问了几次 但没有实际的正确答案或良好的反馈来引导正确的道路 我在用全日历 https fullcalendar io javascript 插件并尝试添加每天多个事件的总小时数 然后我将在每天的页眉或页脚中显示总和 我尝试