巧妙利用JS中的自定义函数——化繁为简,提高效率
利用自定义函数编写年月日时间表:
(复杂写法)如下:
<body>
<select id="year" size="1" style="width: 70px;"></select>
<select id="month" size="1" style="width: 50px;"></select>
<select id="day" size="1" style="width: 50px;"></select>
</body>
<script>
//年月日选择表
var time =new Date();
var year_now = time.getFullYear();
//选取元素
var slt_year = document.getElementById('year');
var slt_month = document.getElementById('month');
var slt_day = document.getElementById('day');
//利用循环确定年份范围
for(i=1990;i<=year_now;i++){
var opt1 = document.createElement('option');
opt1.innerText = i;
slt_year.appendChild(opt1);
}
//利用循环确定月份范围
for(i=1;i<13;i++){
var opt2 = document.createElement('option');
opt2.innerText = i;
slt_month.appendChild(opt2);
}
//自定义改变事件函数
slt_year.onchange = function(){
change();
}
slt_month.onchange = function(){
change();
}
//自定义函数
function change(){
var year = slt_year.selectedOptions[0].innerText;
var month = slt_month.selectedOptions[0].innerText;
if(month ==4 || month ==6 || month ==9 || month ==11){
slt_day.innerText = "";
for(i=1;i<31;i++){
var new_opt3 = document.createElement('option');
new_opt3.innerText = i;
slt_day.appendChild(new_opt3);
}
}else if(month==2){
if(year%4==0 && year%100 !=0 || year%400==0){
slt_day.innerText = "";
for(i=1;i<30;i++){
var new_opt3 = document.createElement('option');
new_opt3.innerText = i;
slt_day.appendChild(new_opt3);
}
}
else{
slt_day.innerText = "";
for(i=1;i<29;i++){
var new_opt3 = document.createElement('option');
new_opt3.innerText = i;
slt_day.appendChild(new_opt3);
}
}
}else{
slt_day.innerText = "";
for(i=1;i<32;i++){
var new_opt3 = document.createElement('option');
new_opt3.innerText = i;
slt_day.appendChild(new_opt3);
}
}
}
(简写写法)如下:
//自定义改变事件函数
slt_year.onchange = function(){
change();
}
slt_month.onchange = function(){
change();
}
//自定义函数
function change(){
var year = slt_year.selectedOptions[0].innerText;
var month = slt_month.selectedOptions[0].innerText;
if(month ==4 || month ==6 || month ==9 || month ==11){
add_day(30);
}else if(month==2){
if(year%4==0 && year%100 !=0 || year%400==0){
add_day(29);
}else{
add_day(28);
}
}else{
add_day(31);
}
}
//自定义通用函数
function add_day(i_max){
slt_day.innerText = "";
for(i=1;i<=i_max;i++){
var new_opt3 = document.createElement('option');
new_opt3.innerText = i;
slt_day.appendChild(new_opt3);
}
}
巧妙利用JS中的自定义函数——化繁为简,提高效率的更多相关文章
- Entity Framework 6 Recipes 2nd Edition(10-5)译 -> 在存储模型中使用自定义函数
10-5. 在存储模型中使用自定义函数 问题 想在模型中使用自定义函数,而不是存储过程. 解决方案 假设我们数据库里有成员(members)和他们已经发送的信息(messages) 关系数据表,如Fi ...
- js中的回调函数的理解和使用方法
js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...
- underscore.js中的节流函数debounce及trottle
函数节流 throttle and debounce的相关总结及想法 一开始函数节流的使用场景是:放止一个按钮多次点击多次触发一个功能函数,所以做了一个clearTimeout setTimeou ...
- js中如何在一个函数里面执行另一个函数
1.js中如何在函数a里面执行函数b function a(参数c){ b(); } function b(参数c){ } 方法2: <script type="text/javasc ...
- 【转载】 Sqlserver中查看自定义函数被哪些对象引用
Sqlserver数据库中支持自定义函数,包含表值函数和标量值函数,表值函数一般返回多个数据行即数据集,而标量值函数一般返回一个值,在数据库的存储过程中可调用自定义函数,也可在该自定义函数中调用另一个 ...
- JavaScript -- 时光流逝(七):js中的全局函数
JavaScript -- 知识点回顾篇(七):js中的全局函数 全局函数可用于所有内建的 JavaScript 对象. (1) encodeURI():把字符串编码为 URI. <script ...
- js中的匿名函数和匿名自执行函数
1.匿名函数的常见场景 js中的匿名函数是一种很常见的函数类型,比较常见的场景: <input type="button" value="点击" id ...
- SparkSQL中的自定义函数UDF
在Spark中,也支持Hive中的自定义函数.自定义函数大致可以分为三种: UDF(User-Defined-Function),即最基本的自定义函数,类似to_char,to_date等 UDAF( ...
- JS中关于把函数作为另一函数的参数的几点小总结
//JS中关于把函数作为函数的参数来传递的问题的小总结//第一,最简单的形式无参函数,直接形式函数的函数名放到括号中,再在执行部分这个函数即可.//当然调用时要穿另一个真正的定义好的函数/*funct ...
随机推荐
- 预编译语句(Prepared Statements)介绍,以MySQL为例
背景 本文重点讲述MySQL中的预编译语句并从MySQL的Connector/J源码出发讲述其在Java语言中相关使用. 注意:文中的描述与结论基于MySQL 5.7.16以及Connect/J 5. ...
- java语言中的匿名类与lambda表达式介绍与总结 (Anonymous Classes and Lambda Expressions)
2017/6/30 转载写明出处:http://www.cnblogs.com/daren-lin/p/anonymous-classes-and-lambda-expressions-in-java ...
- 一个Ruby静态代码分析器 rubocop
A Ruby static code analyzer, based on the community Ruby style guide. http://rubocop.readthedocs.io ...
- 基于Dapper的分页实现,支持筛选,排序,结果集总数,非存储过程
简介 之前事先搜索了下博客园上关于Dapper分页的实现,有是有,但要么是基于存储过程,要么支持分页,而不支持排序,或者搜索条件不是那么容易维护. 代码 首先先上代码: https://github. ...
- 收集了一些容易出错的题,可能大家也不会注意到的基础知识(js)
---恢复内容开始--- 1.题中运用到函数表达式.构造函数.原型.优先级.this. 2.参数影响 3.对原型的运用 4.递归 5.基本类型与引用类型传递 6.优先级 7.自调用函数 ---恢复内容 ...
- 005.Getting started with ASP.NET Core MVC and Visual Studio -- 【VS开发asp.net core mvc 入门】
Getting started with ASP.NET Core MVC and Visual Studio VS开发asp.net core mvc 入门 2017-3-7 2 分钟阅读时长 本文 ...
- JavaScript+svg绘制的一个动态时钟
结果图: 代码如下: <!DOCTYPE html> <html> <head> <title>动态时钟</title> </head ...
- Linux 下搭建www服务器
偶然的机会接触了前端开发,尽管最初的意愿是后台. 不过现在看来,前端后台数据库密不可分! 回想起来感觉自己学习的层次也还很好,因为之前有学习c语言.c++的基础,所以在学习html,js的过程中感觉还 ...
- win7下elasticsearch5.0 安装head插件
项目开发用到了ES,5.X版本的,然而网上好多的安装资料都不能用,全是之前的老版本,今天弄了一上午终于完事了,总结一下安装的步骤. 1.安装NodeJs 去官网https://nodejs.org/e ...
- Android创建窗口(一)创建应用窗口
所谓的窗口(Window)就是一个显示在手机屏幕上可视化视图的一片区域.在Android中窗口是一个抽象的概念,每一个Activity就对应着一个窗口,而所有的窗口都是由视图(View)来呈现,而我们 ...