<div class="datetext">
<img class="dateLeft" src="./images/dateLeft.png">
<div><span class="startDate">2019-07-08</span> 至 <span class="endDate">2019-07-14</span></div>
<img class="dateRight" bindtap="nextWeek" src="./images/dateRight.png">
</div>
// 一周时间表
function getBeforeDate(n) {//n为你要传入的参数,当前为0,前一天为-1,后一天为1
var date = new Date();
var year, month, day;
date.setDate(date.getDate() + n);
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
s = year + '-' + (month < 10 ? ('0' + month) : month) + '-' + (day < 10 ? ('0' + day) : day);
return s;
} getBeforeDate(0); function addDate(date, days) {
var d = new Date(date);
d.setDate(d.getDate() + days);
var month = d.getMonth() + 1;
var day = d.getDate();
if (month < 10) {
month = "0" + month;
}
if (day < 10) {
day = "0" + day;
}
var val = d.getFullYear() + "-" + month + "-" + day;
return val;
} var nowDate = new Date();
//当前日
var nowDay = nowDate.getDate();
//今天是本周的第几天
var nowDayOfWeek = nowDate.getDay();
// console.log(nowDayOfWeek)
// console.log(getBeforeDate(1 - nowDayOfWeek));
// 获取当前一周时间表
$('.startDate').html(getBeforeDate(1 - nowDayOfWeek));
$('.endDate').html(getBeforeDate(1 - nowDayOfWeek + 6));
// 点击上一周
$('.dateLeft').on('click', function () {
let dateStart = addDate($('.startDate').html(), -7);
let dateEnd = addDate($('.endDate').html(), -7);
$('.startDate').html(dateStart);
$('.endDate').html(dateEnd);
})
// 点击下一周
$('.dateRight').on('click', function () {
let dateStart = addDate($('.startDate').html(), 7);
let dateEnd = addDate($('.endDate').html(), 7);
$('.startDate').html(dateStart);
$('.endDate').html(dateEnd);
})
.datetext {
padding: 0 0.4267rem;
height: 1.3067rem;
display: flex;
align-items: center;
background: #fff;
margin-top: 0.0133rem;
} .datetext>img {
width: 0.6667rem;
height: 0.6667rem;
} .datetext>div {
flex: 1;
text-align: center;
color: #333;
font-size: 0.4533rem;
}

js一周时间表的更多相关文章

  1. 用js获取周、月第一天和最后一天(转载)

    var getCurrentWeek = function (day) { var days = ["周日", "周一", "周二", &q ...

  2. JS第一周学习笔记整理

    目录 JS正式课第一周笔记整理 JS正式课第一周笔记整理 webstorm : 代码编辑器 浏览器: 代码解析器: Git : 是一个工具;用于团队协作开发项目管理代码的工具:在工作中用git.svn ...

  3. 微信小程序一周时间表

    <view class="dateView"> <image class="dateLeft" bindtap="prevWeek& ...

  4. React.js 三周 -- 入门到搭建团队基础项目

    吐槽 公司自己的产品,由于历史遗留问题,前端一直是和java放到一个项目里写的. 导致了,前端就被死死的绑在了IDEA战车上.想要看页面效果,先起几个java服务.想要调试一个改动,重启个java服务 ...

  5. JS获取周、月、季度日期

    效果: 代码: //用于获取日期本周.本月.本季度的js //Author : guanghe //文件引用方法:<script src="${staticPath}/common/j ...

  6. JS 显示周 几和 月 日

    function getMyDay(date){ var week; ; var day = date.getDate(); ) week="周日" ) week="周一 ...

  7. 重谈react优势——react技术栈回顾

    react刚刚推出的时候,讲react优势搜索结果是几十页. 现在,react已经慢慢退火,该用用react技术栈的已经使用上,填过多少坑,加过多少班,血泪控诉也不下千文. 今天,再谈一遍react优 ...

  8. 使用.NET Core与Google Optimization Tools实现员工排班计划Scheduling

    上一篇说完<Google Optimization Tools介绍>,让大家初步了解了Google Optimization Tools是一款约束求解(CP)的高效套件.那么我们用.NET ...

  9. C# 解决组合优化问题

    Google Optimization Tools介绍 Google Optimization Tools(OR-Tools)是一款专门快速而便携地解决组合优化问题的套件.它包含了: 约束编程求解器. ...

随机推荐

  1. o2,o3优化

    #pragma GCC optimize(2)//O2优化 #pragma GCC optimize(3,"Ofast","inline")//O3优化

  2. Codeforces Round #296 (Div. 2B. Error Correct System

    Ford Prefect got a job as a web developer for a small company that makes towels. His current work ta ...

  3. HDU - 4221 贪心

    题意: 你有n个任务,每一个任务有一个完成所需时间AI,和一个截止时间BI.时间从0开始,如果完成任务的时间(设这个时间为ans)大于BI那么就会收到ans-BI的惩罚,问你完成所有这些任务你会收到的 ...

  4. 浅谈Webpack模块打包工具四

    Webpack 生产环境优化 生产环境和开发环境有很大的差异,生产环境只注重运行效率,开发环境主要开发效率,webpack4.0开始提出了(mode)模式的概念 针对不同的环境进行不同的配置,为不同的 ...

  5. VS中使用TreeView的Checked属性问题

    VS中使用TreeView,当需要用到Checked属性,并需要同步子节点和父节点的Checked属性时,若使用AfterCheck事件会导致死循环,这里我使用的是NodeMouseClick事件.代 ...

  6. hash table

    Hash Table,叫做哈希表,也叫做散列表.概念:通过某种对应关系h,使得每一个元素和储存位置一一对应.这种对应关系称为哈希函数.它最大的优点就是插入.搜索和删除得很快(O(1)).碰撞(Coll ...

  7. C++ part3

    函数和const references: C++中const用于函数重载 有些情况可以重载,有些不行,具体看↑. 隐式类型转换 references: nowcoder 对于内置类型,低精度的变量给高 ...

  8. codevs1039整数的k划分-思考如何去重复

    题目描述将整数n分成k份,且每份不能为空,任意两种划分方案不能相同(不考虑顺序).例如:n=7,k=3,下面三种划分方案被认为是相同的.1 1 51 5 15 1 1问有多少种不同的分法.输入描述输入 ...

  9. uname -a

    uname -a Linux shell command https://en.wikipedia.org/wiki/Uname#:~:text=uname $ uname # Darwin $ un ...

  10. project generators & project scaffold

    project generators & project scaffold how to write a node cli & Project Scaffold https://www ...