关键词:
【中文标题】如何每小时弹出模态?【英文标题】:How can I pop up modal for each hour? 【发布时间】:2021-12-18 11:07:37 【问题描述】:我想显示从 10 到 6 开始的每个小时的弹出模式,以编写登录用户报告。它应该像 10 点时弹出窗口一样工作,用户编写他们的报告并关闭它。 1 小时后,即 11 点钟再次弹出。
我正在使用 laravel 7、javascript 和 jquery。这些语言中的任何一种对我来说都很方便。请帮帮我。
这是我目前使用的代码
** 弹出模态的javascript代码**
setInterval(function ()
get_task_data();
, 3600000);
$.ajaxSetup(
headers:
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
);
function get_task_data()
$.ajax(
url: ' route('project.employee.task') ',
type:'GET',
data:
).done(function(data)
$('#myModal .modal-body').append(data);
$('#myModal').modal('show');
);
但我想在 10 点 0 点、11 点等准确弹出模态,直到 6 点 0 点。
已编辑
我想每小时发送一次“桌面通知”“请发送您的报告”,类似这样。我该怎么做?
【问题讨论】:
到目前为止你有什么尝试? @kiner_shah 我使用了 setInterval ` setInterval(function () get_task_data(); , 50000); ` 请使用相关代码编辑帖子并突出显示您面临的问题(如果有)。 @kiner_shah 已编辑,请检查 您需要做的是:在页面加载时获取当前时间,例如是 9:45。计算到 10:00 的分钟数,在本例中为 15 分钟,因此请相应地拨打setInterval
。然后在 10:00,当调用函数时,在函数内部调用 clearInterval
,然后再次调用 setInterval
,但这次超时时间为 3600000 毫秒。
【参考方案1】:
使用类似 100/200ms 延迟的间隔,然后检查当前分钟是否为 0。为了避免多次调用,请检查当前 H-m 是否与上次调用不同。
let last = null;
setInterval(function()
const d = new Date();
const curr_hm = `$d.getHours()-$d.getMinutes()`;
if (d.getMinutes() == 0 && curr_hm != last)
console.log('Do task here!');
last = curr_hm;
, 200);
【讨论】:
你为什么使用这个 const curr_hm =d.getHours()-d.getMinutes()
; ?你能解释一下吗
这只是一个字符串,如 H-m(小时 - 分钟)。否则,该函数将在触发分钟内每 200 毫秒调用一次,从而导致不必要的多次调用。
第一次有效,但第二次以后 'curr_hm != last' 将相等,因为分配 'last = curr_hm;'在第一个真实的情况下。所以第二次以后它就不能工作了。
哦,等等,修复了我的代码,在字符串插值中缺少 $。【参考方案2】:
如果没问题,可以使用Window setInterval()方法
如何使用?
setInterval(function()
// Call your modal popup init function here__
, 3600000);
3600000 = 3600 秒 = 60 分钟 = 1 小时
了解更多关于设置间隔Click here
以下示例,代码将用于每隔一小时显示警报弹出窗口
setInterval(function()
alert("Hello");
, 3600000);
更新的代码片段
此代码将用于精确显示弹出模式 10 0' 时钟,11 点时钟等等,直到 6 0' 时钟。
var currentDate = new Date(); // get your current date and time__
var curentHour = currentDate.getHours(); // get Hours of your current time__
var curentMinutes = currentDate.getMinutes(); // get minutes of your current time__
var intervalId = null;
var varCounter = 0; // count the display times, and set initial value
var displayTimes = 9; // between 10'O clock to 6'O clock modal has to display 9 times
// stop function arround 6'O clock
var varModal = function()
if(varCounter < 10)
varCounter++; // you can remove this code
alert(varCounter + 'time'); // you can remove this code
/* your code goes here */
else
// stop modal duisplay after 9 times, it's mea after on 6'O clock
clearInterval(intervalId);
alert('Stop will start on next day'); // you can remove this code
;
/*
* display modal arround 10'O clock,
* This function will trigger after each one hour,
* So you have to set value 9, then only it'trigger arround 10'O clock
* -------
* If you want to trigger this modal arround 9'O clock, you have to check with value 8
*/
if(curentHour >= 9 && curentMinutes > 0)
intervalId = setInterval(varModal, 3600000);
快速测试
从上述代码 sippet 更新以下代码
if(curentHour >= 9 && curentMinutes > 0)
intervalId = setInterval(varModal, 3600000);
改为
var localTimeInHours = 11; // have to mention your current time hours
var hoursForValidation = localTimeInHours - 1;
if(curentHour >= hoursForValidation && curentMinutes > 0)
intervalId = setInterval(varModal, 30000);
我在上述代码中做了以下更改
我将 3600000 更改为 30000(30000 = 30 秒),这将用于 每 30 秒显示一次弹出窗口
使用您的小时值更新 localTimeInHours 变量 当前时间,请查看以下示例:
【讨论】:
但我想准确地弹出模态 10 0' 时钟,11 点钟等直到 6 点钟。怎么做? @developer3onecity请检查更新后的代码sn-p.. 这个函数在加载时会工作一次,否则不会检查` if(curentHour >= 9 && currentMinutes > 0) intervalId = setInterval(varModal, 3600000); ` @developer3onecity,我认为这个解决方案会奏效。尝试将间隔超时值更改为更小的数字,例如60000
(1 分钟)。
@developer3onecity 进行快速测试,请查看评论中的快速测试部分如何在 vue 中创建模态弹出窗口
】如何在vue中创建模态弹出窗口【英文标题】:Howtocreateamodalpopupinvue【发布时间】:2021-10-1722:25:14【问题描述】:我有一个模式弹出窗口,一旦我单击打开模式按钮,它就会显示一些文本,但是当单击按钮时,页面变灰但没有显... 查看详情
Parsley js:如何验证模态弹出窗口内的输入字段并在模态本身内显示错误消息
】Parsleyjs:如何验证模态弹出窗口内的输入字段并在模态本身内显示错误消息【英文标题】:Parsleyjs:HowtovalidateinputfieldsinsideModalpopupanddisplayerrormessagesinsidethemodalitself【发布时间】:2017-10-1007:36:28【问题描述】:如何使用ParsleyJS验... 查看详情
在通用应用程序中,如何将模态视图转换或重用为弹出框?
】在通用应用程序中,如何将模态视图转换或重用为弹出框?【英文标题】:InaUniversalApphowcanyouconvertorreuseamodalviewasapopover?【发布时间】:2012-03-1002:50:48【问题描述】:我有一个模态视图控制器,它使用以下方式显示:[selfpresentM... 查看详情
如何显示与 TrsteelCkeditorBundle 集成的 FMElfinderBundle 的模态对话框或弹出窗口?
】如何显示与TrsteelCkeditorBundle集成的FMElfinderBundle的模态对话框或弹出窗口?【英文标题】:HowtoshowmodaldialogorpopupofFMElfinderBundleintegratedwithTrsteelCkeditorBundle?【发布时间】:2014-04-2806:35:03【问题描述】:我想在模态对话框中使用FMElf... 查看详情
如何使用动态添加的按钮打开模态窗口 - 纯 JavaScript
】如何使用动态添加的按钮打开模态窗口-纯JavaScript【英文标题】:HowtoopenModalWindowwithDynamicallyaddedbuttons-PureJavaScript【发布时间】:2018-10-0311:22:11【问题描述】:我正在从多个url中获取一些JSON数据。我将它们显示在表格中。它还... 查看详情
如何构建 django ajax 模态弹出表单(带有服务器端表单)?
】如何构建djangoajax模态弹出表单(带有服务器端表单)?【英文标题】:Howtobuilddjangoajaxmodalpopupforms(withserversideforms)?【发布时间】:2014-07-0203:51:29【问题描述】:有哪些好的现代模式或django应用程序可以处理出现在弹出窗口中... 查看详情
如何从标签栏控制器弹出或模态显示视图控制器?
】如何从标签栏控制器弹出或模态显示视图控制器?【英文标题】:HowtoPopUporModallyPresentViewControllerfromTabBarController?【发布时间】:2018-05-2215:29:20【问题描述】:如何创建一个在标签栏上的按钮被按下时出现的弹出窗口?我想要... 查看详情
如何在 .NET 中每小时(或每小时的特定时间间隔)引发一个事件?
】如何在.NET中每小时(或每小时的特定时间间隔)引发一个事件?【英文标题】:HowcanIraiseaneventeveryhour(orspecifictimeintervaleachhour)in.NET?【发布时间】:2010-09-2309:29:38【问题描述】:我正在开发一个小型网络爬虫,它将在系统托盘... 查看详情
做一个vue模态弹出框如何(代码片段)
运用的知识点包括:路由的配置插槽vue的过渡动画路由重定向 router/index.js里面配置路由importVuefrom‘vue‘importRouterfrom‘vue-router‘importHomefrom‘@/components/home‘importAboutfrom‘@/components/about‘Vue.use(Rout 查看详情
bootstrap如何设置打开页面10秒后弹出模态框的效果请列出详细代码
参考技术A让页面一开始就加载:$(function()$('#myModal').modal(options););追问是打开页面10秒后弹出模态框。 查看详情
ios:如何关闭模态视图控制器,然后弹出推送的视图控制器
】ios:如何关闭模态视图控制器,然后弹出推送的视图控制器【英文标题】:ios:howtodismissamodalviewcontrollerandthenpopapushedviewcontroller【发布时间】:2013-05-0101:02:05【问题描述】:我有一个视图控制器B,它被根视图控制器A推送到导航... 查看详情
如何每小时运行一次负载测试场景?
】如何每小时运行一次负载测试场景?【英文标题】:HowtorunloadtestScenarioonceeveryhour?【发布时间】:2020-06-0814:43:20【问题描述】:我有几个场景的loadTest,运行了12个小时。我想添加另一个场景,每小时运行一次,由10个虚拟用户... 查看详情
如何每小时运行一次 logrotate
】如何每小时运行一次logrotate【英文标题】:howtorunalogrotatehourly【发布时间】:2019-10-1316:34:50【问题描述】:我创建了一个program.conf,它每小时在EC2实例中记录我的日志。当我强制它命令时,logrotate运行良好(通过sudologrotateprogr... 查看详情
如何进行每小时位置更新?
】如何进行每小时位置更新?【英文标题】:Howtodohourlylocationupdates?【发布时间】:2012-05-3105:59:02【问题描述】:我正在构建一个基于位置的应用程序,但我讨厌打开位置服务图标。我每小时只需要一次坐标,但如果不说该应用... 查看详情
如何使我的键盘弹出窗口更加流畅,我的视图控制器以模态方式出现?
】如何使我的键盘弹出窗口更加流畅,我的视图控制器以模态方式出现?【英文标题】:HowdoImakemykeyboardpopupmorefluentwithmyviewcontrollerappearingmodally?【发布时间】:2013-11-0700:49:09【问题描述】:我希望键盘在视图控制器向上滑动时向... 查看详情
如何安排每小时开始的任务
】如何安排每小时开始的任务【英文标题】:Howtoscheduletaskforstartofeveryhour【发布时间】:2012-04-2913:27:42【问题描述】:我正在开发一项服务,该服务假设每小时开始,准确地在整点重复(下午1:00、下午2:00、下午3:00等)。我尝试... 查看详情
Youtube 模态弹出关闭问题
...点击背景层不覆盖顶部导航菜单内容时,它们仍然显示。如何强制背景拉伸并覆盖菜单?2-滚动条被隐 查看详情
ajax自动完成出现在模态弹出窗口下
...动完成文本框,我遇到的问题是结果出现在模态下。我该如何解决它autocompleteresultappearsbehindthemodal有我的JQueryAjax代码:functionNewPerformAutoComp 查看详情