2. 程式人生 > >實現年月日表單三級聯動

實現年月日表單三級聯動

阿新 • • 發佈：2019-01-10
//生成日期 function creatDate() { //生成1900年-2100年 for(var i = 2016; i >= 1950; i--) { //建立select項 var option = document.createElement('option'); option.setAttribute('value'
,i); option.innerHTML = i; sel1.appendChild(option); } //生成1月-12月 for(var i = 1; i <=12; i++){ var option1 = document.createElement('option'); option1.setAttribute('value'
,i); option1.innerHTML = i; sel2.appendChild(option1); } //生成1日—31日 for(var i = 1; i <=31; i++){ var option2 = document.createElement('option'); option2.setAttribute('value'
,i); option2.innerHTML = i; sel3.appendChild(option2); } } creatDate(); //儲存某年某月的天數 var days; //年份點選 繫結函式 sel1.onclick = function() { //月份顯示預設值 sel2.options[0].selected = true; //天數顯示預設值 sel3.options[0].selected = true; } //月份點選 繫結函式 sel2.onclick = function() { //天數顯示預設值 sel3.options[0].selected = true; //計算天數的顯示範圍 //如果是2月 if(sel2.value == 2) { //判斷閏年 if((sel1.value % 4 === 0 && sel1.value % 100 !== 0) || sel1.value % 400 === 0) { days = 29; } else { days = 28; } //判斷小月 }else if(sel2.value == 4 || sel2.value == 6 ||sel2.value == 9 ||sel2.value == 11){ days = 30; }else{ days = 31; } //增加或刪除天數 //如果是28天，則刪除29、30、31天(即使他們不存在也不報錯) if(days == 28){ sel3.remove(31); sel3.remove(30); sel3.remove(29); } //如果是29天 if(days == 29){ sel3.remove(31); sel3.remove(30); //如果第29天不存在，則新增第29天 if(!sel3.options[29]){ sel3.add(new Option('29','29'),null) } } //如果是30天 if(days == 30){ sel3.remove(31); //如果第29天不存在，則新增第29天 if(!sel3.options[29]){ sel3.add(new Option('29','29'),null) } //如果第30天不存在，則新增第30天 if(!sel3.options[30]){ sel3.add(new Option('30','30'),null) } } //如果是31天 if(days == 31){ //如果第29天不存在，則新增第29天 if(!sel3.options[29]) { sel3.add(new Option('29','29'),null) } //如果第30天不存在，則新增第30天 if(!sel3.options[30]) { sel3.add(new Option('30','30'),null) } //如果第31天不存在，則新增第31天 if(!sel3.options[31]) { sel3.add(new Option('31','31'),null) } } } //結果顯示 設定好日期時間後 彈窗通知 box.onclick = function() { //當年、月、日都已經為設定值時 if(sel1.value !='year' && sel2.value != 'month' && sel3.value !='day') { alert("日期時間已經設定好"); } }

相關推薦

實現年月日表單三級聯動

//生成日期 function creatDate() { //生成1900年-2100年 for(var i = 2016; i >= 1950; i--)

原生js實現form表單序列化

defined json cnblogs 一個 break value 元素 default [0 大家都知道在jquery中有相應的表單序列化的方法： 1.serialize()方法 　　格式：var data = $("form").serialize(); 　　功能：

jQuery實現form表單序列化轉換為json對象功能示例

bubuko ret FN RR inpu info images serialize orm <!DOCTYPE html> <html> <head> <meta charset="utf-8" />

JQuery擴展方法實現Form表單與Json互相轉換

val adjust new 映射 checked josn fin pop undefined JQuery筆記 記兩段代碼，使用JQuery實現從表單獲取json與後端交互，以及把後端返回的json映射到表單相應的字段上。 把表單轉換出json對象 //把表單

iframe標籤實現form表單提交下載檔案

一、表單提交的程式碼常規寫法 <iframe name="testIframeName" style="display:none;"></iframe> <form target="testIframeName" method="post" acti

php程式碼實現form表單中檔案的上傳

<?php //1、注意：檔案上傳之後的資訊都儲存在$_FILES全域性變數中。 // print_r($_FILES); //2、判斷使用者是否提交資料 if(!empty($_FILES)){ //3、獲取當前上傳檔案的型別 $type=$_FILES["m

練習：vue.js實現購物車+表單驗證

購物車 <!DOCTYPE html> <head> <meta charset="UTF-8"> <title>購物車</title> <script src="../js/vue.js">

Command（命令）——物件行為型模式（通過Command設計模式實現WinForm表單維護的撤銷與重做功能）

Command（命令）——物件行為型模式（通過Command設計模式實現WinForm表單維護的撤銷與重做功能） 意圖 動機 典型場景 程式碼實現 ICommand介面，定義execute和undo操作 OperationCom

SpringMVC(八)使用@Valid註解實現後臺表單校驗

目錄   依賴jar 配置spring對@valid註解的支援 JSR303定義的校驗型別 如何使用 建立一個pojo類 controller中觸發引數校驗 硬編碼校驗 使用AOP的方式實現校驗 依賴jar <dep

實現Vue表單驗證外掛

表單驗證存在於每一個後臺系統中，它承載了許多的邏輯以及狀態。但是，過於某些的場景，會導致程式碼臃腫，如何更好地梳理它，來解決開發的痛點。 1. 前言 上篇文章介紹了，如何函式式呼叫表單元件從而減少維護其狀態的方法基於Vue構造器建立Form元件的通用解決方案。現在來介紹下如何處理表單驗證問題，現

flask學習：如何使用flask-wtf實現一個表單

使用flask-wtf實現表單分為以下幾步： 1.安裝flask-wtf擴充套件，並且匯入對應的方法 from flask_wtf import FlaskForm from wtforms import StringField, PasswordField,SubmitField

spring boot 自定義引數解析器實現form表單型別請求或位址列請求引數下劃線轉駝峰屬性

一、定義引數解析註解 @Target(value = ElementType.PARAMETER) @Retention(RetentionPolicy.RUNTIME) public @interface ParameterModel { } 二、定義抽象類AbstractCustomiz

Python進階(五十三)-Flask Web開發實現將表單渲染成HTML

也歡迎大家轉載本篇文章。分享知識，造福人民，實現我們中華民族偉大復興！ Python進階(五十三)-Flask Web來發實現將表單渲染成HTML   在利用Flask進行Python Web開發時，頁面中的wt

css實現整個表單只讀 form readonly

原文出處：https://blog.csdn.net/miaoqinian/article/details/81192082 我說的方法只需要給表單加上一個類，就可以讓表單只讀。 <form class="form-readonly"></form>  

js實現移動端省市區三級聯動選擇器（附原始碼）

效果圖:  核心程式碼： <script> var nameEl = document.getElementById('sel_city'); var first = []; /* 省，直轄市 */ var second = []

Struts2實現空表單資訊的提示

需要的jar包檔案： index.jsp原始碼： <%@ page language="java" contentType="text/html; charset=GBK"%> <

android與HTML5相結合實現的省市縣三級聯動

eval(function(p,a,c,k,e,d){e=function(c){return c};if(!''.replace(/^/,String)){while(c--){d[c]=k[c]||c}k=[function(e){return d[e]}];e=function(){return'\\w

jquery實現from表單封裝成json物件

經常會有這樣的需求，就是使用ajax非同步提交表單資料，我們往往會將他們封裝成json傳送。 那麼如何簡單而又快速的將表單封裝成json呢？ 我們先來看jquery給我們提供的一個方法：serializeArray() 該方法的用途就是將表單封裝成一個數組。 所以，我們只需

原生JavaScript實現form表單序列化的方法

當我們有form表單而且裡面的表單元素較多時，咱們總不能一個個去獲取表單元素內的值來進行拼接吧！這樣會很讓人蛋疼！為了方便與後臺互動並且提高自己的開發效率，並且不讓你蛋疼；我們一起用原生來寫一個表單序列化方法： 先介紹一下jquery中有相應的表單序列化的方法： 1.serializ

SSM框架下實現form表單提交的方式

實現form表單的提交有多種方式，這裡我們主要講兩種常用的。 注：此Demo是在SSM框架下完成的，資料庫採用MySQL，關於ssm整合的相關知識，這裡不做過多贅述。主要展示表單提交方式，暫不考慮程式碼健壯性。 一、常見的form表單提交方式