手机触摸板 日期选择控件整理

js手机端日期控件 js手机端日期控件 多兼容 超好用 立即下载

1:首先引用js文件:

 <!--时间控件样式-->
    <link rel="stylesheet" type="text/css" href="~/Theme/css/mobiscroll.custom-2.13.2.min.css">
  <!--时间控件mobiscroll-->
    <script src="~/Theme/plugins/mobiscroll/js/mobiscroll.core-2.5.2.js" type="text/javascript"></script>
    <script src="~/Theme/plugins/mobiscroll/js/mobiscroll.core-2.5.2-zh.js" type="text/javascript"></script>


    <link href="~/Theme/plugins/mobiscroll/css/mobiscroll.core-2.5.2.css" rel="stylesheet" type="text/css" />
    <link href="~/Theme/plugins/mobiscroll/css/mobiscroll.animation-2.5.2.css" rel="stylesheet" type="text/css" />
    <script src="~/Theme/plugins/mobiscroll/js/mobiscroll.datetime-2.5.1.js" type="text/javascript"></script>
    <script src="~/Theme/plugins/mobiscroll/js/mobiscroll.datetime-2.5.1-zh.js" type="text/javascript"></script>

   //选择时间
        function selectDatetime() {
            var currYear = (new Date()).getFullYear();
            var opt = {};
            opt.date = { preset: 'date' };
            opt.datetime = { preset: 'datetime' };
            opt.time = { preset: 'time' };
            opt.default = {
                theme: 'android-ics light', //皮肤样式
                display: 'modal', //显示方式
                mode: 'scroller', //日期选择模式
                lang: 'zh',
                startYear: currYear - 10, //开始年份
                endYear: currYear + 10 //结束年份
            };

            //$("#ApptDate").val('').scroller('destroy').scroller($.extend(opt['date'], opt['default']));
            var optDateTime = $.extend(opt['datetime'], opt['default']);
            //var optTime = $.extend(opt['time'], opt['default']); 
            $("#ApptDate").mobiscroll(optDateTime).datetime(optDateTime);
            //$("#ApptDate").mobiscroll(optTime).time(optTime);
        }


2:前台html代码:

<input type="text" id="ApptDate" />

效果图:


android和iphone显示的是不一样的效果

css和js地址:百度盘点击下载

大家觉得好就给一个回复吧!谢谢!

支持手机的html5 日期时间控件 jquery实现的时间选择控件支持手机的html5 演示地址:http://www.ui3g.com/code/uicode-1384.html 立即下载

相关推荐

手机网站时间选择器

手机站开发时间选择器,各种手机系统上手机设置时间样式!

轻便易用的手机端日期插件js:让时间管理更便捷

"轻便易用的手机端日期插件js:让时间管理更便捷"提供了丰富多样的日期选择方式,包括日历视图、时间轴视图和列表视图等。总的来说,"轻便易用的手机端日期插件js:让时间管理更便捷"具有以下主要优势:简洁易用的界面设计、丰富多样的日期选择和时间管理选项、高度定制化的功能、与日历应用的同步支持等。"轻便易用的手机端日期插件js:让时间管理更便捷"的独特之处在于其简洁易用的界面设计和高度定制化的功能。"轻便易用的手机端日期插件js:让时间管理更便捷"是一款专为手机端设计的日期插件,旨在帮助用户更便捷地管理时间。

2401_84293948的博客 495

手机端漂亮的日期插件mobiscroll,免费使用

mobiscroll,很漂亮的日期插件,兼容性好,支持web、APP、wap手机端开发;附件包含了一张效果图,其他效果调整参数即可见。 本附件亮点: 1,下载附件即可免费使用(官方下载需收费,网址:http://www.mobiscroll.com/); 2,中文显示等参数已全面说明,更换后即可拿到想要的效果,无需花太多时间研究(本人最初使用时因为中文问题花了不少时间研究)。 免积分共享出来,希望对有需要的人有帮助。谢谢!

jQuery 移动端触屏滑动日期控件(mobiscroll) 简单配置 谁用谁知道 ^_^

1:插件生成的来源 在很多页面和web应用中都有输入日期和时间的地方,我们知道HTML5提供一个input的date属性,对的就是时间选择。但是原始 时间选择是不太好看的。所以就有了找到相关的插件封装。 2:HTML5原始官方的date说明 Input Date 对象 Input Date 对象是 HTML5 中的新对象。 Input Date 对象表示 HTML <in...

tanqingfu1的博客 3149

漂亮的移动端日期选择插件 mdatetimer

漂亮的移动端日期选择插件:http://blog.youkuaiyun.com/libin_1/article/details/50400941

手机滑动选择日期时间插件

移动端。时间筛选日历。用于开发工具类 移动端。时间筛选日历。用于开发工具类

实用插件(九)手机日历插件——Mobiscroll

1、点我下载2、使用方法: <!--日历插件3个css--> <link href="../Mobiscroll/mobiscroll.android-ics-2.5.2.css" rel="stylesheet"> <link href="../Mobiscroll/mobiscroll.animation-2.5.2.css" rel="stylesheet"> <link href="../M

front_end_fan 1828

TJA1445/TJA1465 CAN收发器硬件设计与软件配置实战指南

控制器局域网(CAN)总线是汽车电子和工业控制领域实现电子控制单元(ECU)间可靠通信的核心技术。其工作原理是将数字信号转换为差分信号进行抗干扰传输,技术价值在于构建稳定、高效的分布式实时控制系统。随着汽车电子架构向域集中式演进,对CAN总线的通信速率、网络复杂度和静态功耗提出了更高要求,这催生了支持CAN FD协议和智能电源管理的新一代高速CAN收发器。在车载网关、域控制器及工业网络节点等应用场景中,NXP的TJA1445和TJA1465系列收发器凭借其部分组网(Partial Networking)和选

weixin_29655587的博客 405

js实现日期控件

前言最近花了点时间写了个日期控件,首先说说写日期控件的初衷,有两点: 第一点是没有写过对于日期的生成不甚了解 工作中使用框架的日期控件,但是想要自己实现下该日期控件主要是学习使用,功能不多,支持输出天以及日期范围的选择。 实现思路日期控件实现了单日期以及日期范围的功能,单日期实现效果如下图: 日期范围实现效果图如下: 下面主要说说主要的实现思路,首先说说面板日期的生成,日期面板如下图: 日期面

玉案轩窗的博客 1万+

光纤接口类型与应用场景全解析

本文全面解析了光纤接口的类型与应用场景,详细介绍了SC、LC、FC和ST等主流光纤接口的特点及适用环境。从数据中心的高密度布线到工业环境的极端条件,提供了专业的接口选型指南和实战经验,帮助读者根据具体需求选择最合适的光纤接口方案。

weixin_29289821的博客 411

huggingface 镜像站推荐

在做 Ai 应用开发或者学习的时候,我们经常需要下载各种模型,而 huggingface 的模型下载速度很慢或者根本就连不上,这里推荐一个 huggingface 的镜像站,速度很快,可以大大提高我们的效率。

t951984189的博客 1万+

Vue移动端日期选择器(datepicker.js)

声明:因为帮忙用到移动端用到日期选择器,效果如图 使用方法: 第一步:在main.js中引入 import datePicker from "../static/js/datePicker.js" Vue.use(datePicker) 第二步:在.vue文件中使用 <input id="demo" type="text" placeholder="选择出生日期" readonly&gt...

weixin_44979432的博客 6708

[QDS]从零开始,写第一个Qt Design Studio到程序调用的项目

最近在使用Qt Design Studio进行开发,但是简中网上要不就是只搜得到Qt Designer(Qt Creator内部库),要不就只搜得到一点营销号不知道从哪里搬来的账号,鉴于Qt Design Studio是一个这么强大的软件,自然是需要来进行一下小小的实践的。所以开了这篇文章,方便没有使用过Qt Design Studio 和 QML的开发者也可以快速上手QDS(Qt Design Studio)。在本文中,你将学会如何使用QDS开发一个简单的QML程序,与你的C++后端代码进行交流。

Andius的博客 8210

移动端触屏滑动日期控件

2sf.skin15日</div><div class="month-year" id="month-year">2023年11月</div><div class="weekday">日移动端触屏滑动日期控件

zichenblog的博客 965

医学图像处理实战:3D Slicer从安装到病灶分析全流程指南

本文提供了一份详尽的3D Slicer实战指南,涵盖从软件安装、DICOM数据导入到图像增强、病灶分割及三维可视化的全流程。重点演示了如何利用阈值分割、区域生长等核心图像处理技术进行病灶分析,并生成定量报告,是医学影像分析初学者的实用入门教程。

weixin_29278805的博客 600

RexUniNLU零样本通用自然语言理解:nlp_deberta_rex-uninlu_chinese-base模型实战解析

本文深入解析了RexUniNLU零样本通用自然语言理解模型(nlp_deberta_rex-uninlu_chinese-base)的实战应用。通过详细的环境配置、模型加载及实战案例,展示了该模型在零样本场景下的强大能力,如实体识别和复杂关系抽取,显著提升NLP任务效率。

weixin_29088655的博客 250

js手机端时间区间_移动端网页轻量级日期控件LCalenda

插件描述:LCalendar移动端日期时间选择控件注:请在移动端查看效果。LCalendar纯原生js的移动端日期插件,不依赖任何库,体积非常小只有10k用法在html页面中引入input标签,通过自定义属性data-lcalendar控制最小日期和最大日期,写法如下:......将样式文件引入到页面中:......同时引入js文件到页面中:......初始化插件:...varcalendar...

weixin_33848436的博客 1576

245. 项目195:简易文字冒险游戏——《跟老吕学Python·新手》

如果您在学习本专栏教程时遇到任何问题,或有任何技术交流的意愿,欢迎在文章评论区留言,或通过优快云私信与老吕取得联系。老吕将及时回复您的留言,并与您共同探讨,以期为大家提供更为精准和有效的帮助。老吕珍视每一位读者的反馈和支持,期待与您共同学习、共同进步,共同创造美好的未来!我们的目标是不仅教会您Python语言,更是培养您解决问题的思维方式。请随意翻阅,按照自己的节奏学习,让这本专栏成为您编程旅程中的可靠伙伴。开发一个简易的文字冒险游戏,通过文本描述场景和事件,让玩家通过选择不同的选项来推动故事发展。

Python老吕的博客 710

移动端mobiscroll时间控件的使用

相关js代码: $(function(){ var currYear = (new Date()).getFullYear(); var opt={}; opt.date = {preset : 'date'}; opt.datetime = {pres

期待王教授 1万+

ACS运动控制器编程 怎么学习

本文介绍了ACS运动控制器编程的完整学习路线,从零基础到实战应用。ACS是以色列高端多轴运动控制平台,适用于自动化设备、精密平台等项目。学习路径包括:1)安装官方软件SPiiPlusControlSuite;2)掌握轴、运动模式和指令三个核心概念;3)学习10个基础指令;4)编写首个运动程序;5)结合C#进行联合编程。进阶内容包括多轴同步、电子凸轮等工业应用,并推荐官方手册作为主要学习资源。通过7天的系统学习,即可掌握单轴运动控制,结合C#实现工业级设备开发。

StevenChen的博客 1308

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明,包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

手机端日期日历时间插件lCalendar.js

1.页面引入样式css ... &lt;link rel="stylesheet" href="LCalendar.css"&gt; ... 2.页面引入js ... &lt;script src="LCalendar.js"&gt;&lt;/script&gt;... 3.页面样式书写--在html页面中引入input标签,通过自定义属性data-lcalendar控制最小日期和..

dxj124的博客 8914

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

JQuery手机版日期选择控件之jdate(jquery-date)

一、控件说明 jdate(jquery-date) 注:当前控件兼容支持手机浏览器,常用选择即可支持。 git源代码地址: https://github.com/weijhfly/jqueryDatePlugin 如果是在vue或其他模块开发的项目中,参考git中的使用说明。 在html中使用,比较简单,引用jquery控件后,再引用jdate控件 <script src=...

天马3798 1万+

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

手机端日期时间插件lCalendar.js

1.页面引入样式css … ...   2.页面引入js … … 3.页面样式书写–在html页面中引入input标签,通过自定义属性data-lcalendar控制最小日期和最大日期 … ...   4.在js中初始化插件: … var calendar = new LCalendar(); calendar.init({     ‘trigge...

weixin_43932696的博客 2482

超级简单好用的JS日期控件

在做订单查询的时候,用到了时间条件,看看.net自带的时间控件,感觉很麻烦,不小心看到了帝国的这个JS时间控件,感觉很方便,当鼠标放在输入框内的时候,触发JS,在当前位置新建一个层。 效果如图所示: 用的时候先在<head></head>插入 <SCRIPTsrc="Images/setday.js"></SCRIPT> ...

XIZI1312的博客 355

【经验】Angularjs 中使用 layDate 日期控件

layDate 控件地址:http://laydate.layui.com/ 前情:原来系统中使用的日期控件是UI bootstrap(地址:https://angular-ui.github.io/bootstrap/)里的。后来因为各种原因,要换掉UI bootstrap中的日期控件,改用layDate日期控件。 解决思路:将layDate的初始化及相关代码定义在指令里。 问题关键点:l...

weixin_30703911的博客 318

手把手教你写Js日期时间选择器(3)-让控件滑动起来

本节为大家讲解怎么让控件滑动起来,这里需要用到一个第三方库IScroll.js.先奉上链接地址:IScroll githubIScroll 网站IScroll介绍IScroll是一个高性能,体积小,无依赖性,多平台的一个javascript滑动器.和Android里面的差不多. IScroll不只有滑动功能,还有缩放,平移等功能,具体看文档撒. IScroll的动画效果也有很多bounce, e

寄莫相伴的专栏 1万+
上一篇: 通过XML文件实现省份、城市、区域三级联动
下一篇: c# POST和GET方式通过服务器地址提交数据
make1828
博客等级 码龄19年 60粉丝 105原创
评论 6
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值