JS原生代码之倒计时抢购
学到了原声js改变input的disabled的属性值,因为想让倒计时结束的同时,抢购按钮可以被点击。代码为:document.getElementById("buy").disabled = "";或者disabled的值为false也可以。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>倒计时抢购</title>
</head>
<body>
<span id="time"></span>
<input type="button" value="开始抢购" id="buy" disabled="true">
<script>
function Time(){
var date = new Date();
var nowhour = date.getHours();
var nowmin = date.getMinutes();
var nowsec = date.getSeconds();
var finalhour = 22;
var finalmin = 22;
var finalsec = 22;
var finals = finalhour * 3600 + finalmin * 60 + finalsec;
var nows = nowhour * 3600 + nowmin * 60 + nowsec;
var showhour = parseInt((finals - nows)/3600);
var showmin = parseInt((finals - nows)%3600/60);
var showsec = (finals - nows)%60;
if(showsec<10){
showsec = "0" + showsec;
}
if(showmin<10){
showmin = "0" + showmin;
}
if(showhour<10){
showhour = "0" + showhour;
}
document.getElementById("time").innerHTML = "距离22点22分22秒还有:" + showhour + ":" + showmin + ":" + showsec;
if(showhour == "00" && showmin == "00" && showsec =="00"){
clearInterval(t);
document.getElementById("buy").disabled="";
}
}
Time();
var t = setInterval(Time,1000);
</script>
</body>
</html>
JS原生代码之倒计时抢购的更多相关文章
- js原生代码实现轮播图案例
一.轮播图是现在网站网页上最常见的效果之一,对于轮播图的功能,要求不同,效果也不同! 我们见过很多通过不同的方式,实现这一效果,但是有很多比较麻烦,而且不容易理解,兼容性也不好. 在这里分享一下,用j ...
- 仿jQuery的siblings效果的js原生代码
仿jQuery的siblings效果的js原生代码 <previousSibling> 属性返回选定节点的上一个同级节点(在相同树层级中的前一个节点). <nextSibling&g ...
- 用Node.js原生代码实现静态服务器
---恢复内容开始--- 后端中服务器类型有两种 1. web服务器[ 静态服务器 ] - 举例: wamp里面www目录 - 目的是为了展示页面内容 - 前端: nginx 2. 应用级服务器[ a ...
- JS原生代码实现导航高亮
一 实现原理 根据当前页面滚动条的高度判断当前页面应当与导航栏中哪个导航相关联,并对相应的导航设置高亮样式. 二 代码解析 先简单写一个页面顶端的导航栏:<nav> <ul> ...
- 基于面向对象的图片轮播(js原生代码)
无论你想走多远,你都需要不断地走下去.前端最精华的便是原生的js,这也是我们前端工程师的技术分层的重要指标,也提现这你的代码能力,开发的水平.废话不多说,进入今天的主要分享————基于面向对象思想的图 ...
- day28(ajax之js原生代码实现)
ajax ajax:异步页面无刷新技术 AJAX:异步的 JavaScript And XML. * 使用的是老的技术,用的是新的思想. AJAX的功能:完成页面的局部刷新,不中断用户的体验. XML ...
- js原生代码实现鼠标拖拽(超简单)
首先先来看这一张图 在这种图中,盒子的大小为512px,并且margin-left:-250px margin-top:140px;并通过一些样式让其在中部显示 这些样式都不是重要的,这里加个marg ...
- js原生代码编写一个鼠标在页面移动坐标的检测功能,兼容各大浏览器
function mousePosition(e) { //IE9以上的浏览器获取 if (e.pageX || e.pageY) { return { ...
- 高效的js原生代码
1.遍历元素 //不推荐 var element = document.getElementsByTagName('div'); for(var i=0; i<element.length; i ...
随机推荐
- VUE【一、概述】
早上写的忘了保存..还有很多唠叨的内容...哎又得重新写一遍..想吐槽那个自动保存有卵用.. 今天周一,早上起来继续 由于周六加了一整天班,导致周日无心学习,一天都在玩游戏看电影,到了晚上反而更加空虚 ...
- Linux Centos虚拟机扩容
Linux Centos虚拟机扩容(/dev/mapper/centos-root) 1:.首先查看我们的根分区大小是多少 df -h 文件系统 类型 容量 已用 可用 已用% 挂载点``/dev/m ...
- Educational Codeforces Round 40 C. Matrix Walk( 思维)
Educational Codeforces Round 40 (Rated for Div. 2) C. Matrix Walk time limit per test 1 second memor ...
- 从mysql8.0读取数据并形成pandas dataframe类型数据,精确定位行列式中的元素,并读取
from pandas import * import pandas as pd from sqlalchemy import create_engine engine = create_engine ...
- 【python爬虫】 爬云音乐我和xxx共同听过的歌曲
闲聊的时候,觉得,想写个爬虫,爬下2个人共同听过的歌曲有哪些,然后一鼓作气,花了一个多小时,写了一个.支持最近一周和所有时间,需要用户没有关闭听歌排行显示 How to start 使用到的工具是Se ...
- [Python自学] day-20 (Django-ORM、Ajax)
一.外键跨表操作(一对多) 在 [Python自学] day-19 (2) (Django-ORM) 中,我们利用外键实现了一对多的表操作. 可以利用以下方式来获取外键指向表的数据: def orm_ ...
- 2、创建MFC应用程序——基于对话框,时间计时器
使用计时器更新MFC界面时间,频率1s. 文件——新建项目——MFC应用程序,下一步,选择基于对话框,其他默认,完成. 双击窗体(或者鼠标右键)进入类向导,自动创建Ontimer()函数 void C ...
- C++之带有默认参数值的构造函数
在一个类中 ,如果程序员没有写,任何一个构造函数,则编译器将为该类提供一个默认的构造函数,如果程序员对类的构造函数进行了重载,则编译器将不提供默构造函数,这里需要手动书写一个无参的构造函数, 无参的构 ...
- 部分易错JS知识点整理(缓慢填坑)
主要还是各地搜刮来的,本人对于这方面的总结还是8彳亍,给各位大佬磕头了砰砰砰 1. 2.JS闭包和匿名对象以及作用域 js在执行之前,会将所有带var和function的进行提前定义和声明.(带var ...
- 洛谷【P2257】 YY的GCD
出处:http://www.cnblogs.com/peng-ym/p/8652288.html ( 直接去出处那看就好了 ) 题目描述 神犇YY虐完数论后给傻×kAc出了一题 给定N, M,求 ...