js怎么实现滚动的时间选择器?

如图。请问这种可以滚动选择的时间选择怎么实现呀,还有怎么取到选好的时间值判断他的星座和生肖呀,麻烦各位大佬上一下代码,十分感谢!图片说明

4个回答

你好,用心一天时间 给你解答的。基于http://www.jq22.com/jquery-info10900 给你修改的,星座已经加上。这里不能传文件,我就全部加在一个 index文件里了,然而这里字符有限制,不能放么多,我就写在博客面了,专门为你这个回答写的。根据时间告诉星座!你直接复制过去就可以运行了。

希望采纳!

请移步:
Mobiscroll插件-根据时间选择弹出星座
https://blog.csdn.net/lllomh/article/details/90703262

xl1090453281
xl1090453281 回复lllomh: 好的!
4 个月之前 回复
lllomh
lllomh 回复xl1090453281: 顺便去博文留个评论踩一踩啊 ^^
4 个月之前 回复
lllomh
lllomh 回复xl1090453281: 哈哈,那就关注我一下呗,为了你这个因为太长,外链接多,我还被封号了,还跟客服扯了好久。
4 个月之前 回复
xl1090453281
xl1090453281 真的十分感谢!!!!
4 个月之前 回复
xl1090453281
xl1090453281 插件我找到了但是不会判断星座和生肖
4 个月之前 回复
xl1090453281
xl1090453281 插件我找到了但是不会判断星座和生肖
4 个月之前 回复
<script type="text/javascript">
/* 生效的实现参考星座 */
// 星座对应的月份(自行百度)
var constellation = [
    {start: '1-21', end: '2-20', cst: '星座1'},
    {start: '2-21', end: '3-20', cst: '星座2'},
    {start: '3-21', end: '4-20', cst: '星座3'},
    {start: '4-21', end: '5-20', cst: '星座4'},
    {start: '5-21', end: '6-20', cst: '星座5'},
    {start: '6-21', end: '7-20', cst: '星座6'},
    {start: '7-21', end: '8-20', cst: '星座7'},
    {start: '8-21', end: '9-20', cst: '星座8'},
    {start: '9-21', end: '10-20', cst: '星座9'},
    {start: '10-21', end: '11-20', cst: '星座10'},
    {start: '11-21', end: '12-20', cst: '星座11'},
    {start: '12-21', end: '1-20', cst: '星座12'},
]

$(function(){
    // juqery日期选择插件
    $('#beginTime').date(null, function(data) {
        // data:选中的日期
        console.log(data)
        var year = data.split('-')[0]
        var selectDate = new Date(data)
        var curCst = constellation.find((item) => {
            var start = new Date(year + '-' + item.start)
            var end = new Date(year + '-' + item.end)
            return start <= selectDate && end >= selectDate
        }) || constellation[11]
        // curCst: 选中的日期对应的星座
        console.log(curCst)
    });

    $('#endTime').date({theme:"datetime"});

});


</script>
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
js实现的时间选择器网页
使用JavaScript编写的时间选项效果,能够获取系统的当前时间
Android 滚动时间选择器
这是效果图,有需要可以下载。 http://download.csdn.net/download/sky_castle/10012564
android 滚动轮式时间选择器
android 滚动轮式时间选择器,选择成功后时间直接显示在特定位置。项目代码完整,android studio可直接使用,eclipse也可使用核心代码。用过希望给个评价。
Android 滚动时间选择器,爱上租时间选择器
Android 滚动时间选择器,爱上租时间选择器,这个是高仿爱上租时间选择器。
JS实现图片特效滚动
JS实现图片特效滚动,幻灯片多样式切换特效。纯JS实现。
js 实现 滚动的表格
js 实现 滚动的表格! 值得下载看看!资源免费,大家分享!!
js实现不间断滚动
js实现不间断滚动,放有静态页面里是正常的。但放在ASPX页面里就不行了。去掉头部的代码就正常
js实现全屏滚动
css部分:*{margin:0;padding:0;}div{width:100vw;height:100wh;}div:nth-child(1){background-color:red;}div:nth-child(2){background-color:blue;}div:nth-child(3){background-color:green;}div:nth-child(1){backg...
js实现平滑滚动
 差别:原生JS移动速度固定, jQ可以设置移动的时间,快慢不一。 原生JS实现页面平滑滚动 window.scroll({ top: [number] y, left: [number] x, behavior: [stirng] behavior }) //behavior 三个取值: auto,instant(瞬间移动),smooth(平滑移动) jQue...
js实现滚动工具栏
如图:模拟微博工具栏 说明:鼠标点到黑色框中哪个模块,便会向下展开哪个模块的工具栏,鼠标拿开便会自动隐藏。 html代码:<body> <div class="nav"> <ul><li onmouseover="show(this)" onmouseout="hide(this)"><a href="#">微博</a> <ul> <li><a href="#">私信</a></li> <l
js 实现 滚动导航菜单
js 实现 滚动导航菜单! 值得下载看看!资源免费,大家分享!!
js 实现的间歇滚动
js实现的滚动,可作为站内公告的展示形式
js实现表格滚动
&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;Document&amp;lt;/title&amp;gt; &amp;lt;style type=&quot;text/css&quot;
js怎么实现鼠标滚动事件?
如题,js怎么实现鼠标滚动事件?我怎么知道它是向前滚动还是向后滚的了?
日期与时间选择器JS
/*///////////////////////////////////////////////////////////////// 函数说明:风声日期和时间选择器,整个功能只有一个函数调用极其方便 功能说明:年份根据输入(当前)日期前后5年自动选择,1000--9000年设定 函数原型: function selectTime(thisIdName[,mode]) 参数说明: thisIdName:接受返回值的对象ID名称 mode: 返回值类型 0:默认值,返回yyyy-mm-dd hh-mm-ss 1:返回yyyy-mm-dd 2:返回hh-mm-ss 3:返回mm-dd 4:返回hh-mm 5:返回yyyy-mm-dd hh-mm
js 前端时间选择器
&amp;lt;div class=&quot;bname fl&quot;&amp;gt; 创建时间: &amp;lt;br&amp;gt; &amp;lt;input type=&quot;date&quot; id=&quot;startCreatetime&quot; max=&quot;&quot;&amp;gt; - &amp;lt;input type=&quot;date&quot; id=&quot;endCreatet
js 时间选择器 日期选择器
js 时间选择器 js 时间选择器 js 时间选择器日期选择器
怎么实现滚动
我想实现这样的功能,有一个这样的网页,高度固定,没有滚动条,在网页里有一个表格,表格的行数比较多,能不能给"表格加一个滚动条"(不能框架)?谢谢
滚动背景怎么实现?
小弟再仿做一个游戏:是男人就下一百层rn不知怎么实现滚动的背景rn晴大厦门抽空赐教
freeform怎么实现滚动?
各位大虾,我用freeform的显示方式做表,因为项目很多,一屏无法显示,这个时候,怎样实现滚动条随输入滚动呢?因为是单条的记录,所以用dw_1.scrolltorow(0)无法实现。
新闻左右滚动JS实现
自己写的一个列表左右滚动的Demo,各个HTML的元素的样式可以根据自己的需求来更改,下面是代码   &amp;lt;!doctype html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;title&amp;gt;列表左右滚动&amp;lt;/title&amp;gt; &amp;lt;meta charset=&quot;utf-8&quot;&amp;gt; &amp;lt;style type=&quot;text
JS实现大图滚动、无缝连接
大图滚动2 *{ margin:0; padding:0; } #outer{ width: 1000px; height: 500px; margin:100px auto; o
code2.htm js滚动图片实现
如果你是初学这者,你可以看看这个javascript实例,想必对你一定有很大帮助
【js实现字体滚动起来】
&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;字体循环动起来&amp;lt;/title&amp;gt; &amp;lt;style type=&quot;text/css&quot;&amp;gt;
滚动广告动画 JS实现
使用JS实现的鼠标滑动,广告图片依次替换,包含详细讲解,只要更换成心仪的图片,就可实现首页动画超炫的动画效果
JS 实现鼠标滚动页面跳转
JS 实现鼠标滚动页面跳转(function() { var scrollFunc = function(e) { var ee = e || window.event; var fullheight = document.body.offsetHeight; if (e.wheelDelta) { //IE/Opera/Chrome -120是下+120是上 let a= e.wheel
js实现下拉滚动加载数据
需要加hidhen标签:         //下一页            //是否还有内容           //是否加载完           //排序字段 js代码:                    $(function () {                     var cat_id = "";                     var so
js实现文字横向滚动
js实现文字横向滚动
js实现实时滚动加载
如果一个页面有2000张图片,我们肯定不能一下子全都加载完成的,因此我们可以做一个根据滚动事件来动态加载,下面是代码: &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;Document&amp;lt;/title&amp;gt; &amp;lt;styl
js实现滚动的网页标题
&amp;lt;title&amp;gt;欢迎你来到大学堂&amp;lt;/title&amp;gt;&amp;lt;script type=&quot;text/javascript&quot;&amp;gt;    function scorll(){   var title=document.title;   var first=title.charAt(1);   var last=title.substring(2,title.length);   //...
js实现闭合的marquee滚动
1 2 3 4 5 6 7 8 ...
js实现文字纵向滚动
js实现文字纵向滚动
js实现图片连续滚动
利用js实现图片的不间断滚动,可以设置滚动时间、速度,以及滚动的宽度,非常实用
js实现滚动文本显示
A,需求背景:对于一个实时更新信息的网站来说,通常需要有一个模块动态的显示动态信息,通常会使用异步更新。由于模块空间大小有限而展示的信息比较多,这时我们可以采用类滚动新闻的方式展示动态信息。下面将使用js实现类似这样的功能。 B,实现 下面是javascript部分,需要导入相应的jQuery包: function dynamicnews() { //下面通过异步Ajax获取服务器数据,假设下
Js 实现列表动态滚动
div class="scrollNews" style="OVERFLOW: hidden; float:left; height:100px;"&gt; &lt;ul id="p1"&gt; &lt;li&gt;&lt;a href="#"&gt;talking to the moon 放不下的理由.&lt;/a&gt;&lt;/li&gt; &lt...
js实现滚动功能---公告栏
最近找工作找的头昏脑胀,突然发现自己之前是多么的幸福。。。。 闲下来,充实我的博客 滚动公告栏 滚动公告栏,之前在毕设中就实现过一次,现在翻出来重新写一次。 原理:div公告栏(#part2)设置具体宽高,并设置溢出隐藏,这个地方就是我们公告展示的地方。在公告栏中有两个div,一个用来放置我们的公告内容,另一个用来填补当公告一滚动完时,中间空出来的一小块空间。 注:红色为公告栏,...
JS实现信息滚动制作
关键: setInterval(function,time); //每隔一个时间间隔执行一次函数 setTimeout(function,time); //在一段时间后执行一次函数 scrollTop属性:元素隐藏部分的高度。scrollTop属性只有DOM元素才有,window/document没有
利用js实现数字滚动
&amp;lt;script type=&quot;text/javascript&quot; src=&quot;/Public/js/jquery-3.3.1.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt;   &amp;lt;script type=&quot;text/javascript&quot; src=&quot;/public/js/jquery.waypoints.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt
js实现信息滚动显示
[code=&quot;java&quot;] ul,li{margin:0;padding:0;font-size:12px;color:#999;} ul{height:100px;overflow:hidden;} ul li{line-height:20px;height:20px;} “卧槽泥马”:又一网络新词1 “卧槽泥马”:又一网络新词2 “卧槽泥马”...
JS实现文字的左右滚动
p{position: absolute;left: 125px; top: 100px;} var tag = 0;//标志,判断对象当前位置是在最左还是最右,注意这里必须设置为全局变量,否则在执行setTimeOut方法会重置为0,使得无法再向右返回 //移动文字 function moveWord(){ var resource = docume
相关热词 c# 线程结束时执行 c# kb mb 图片 c# 替换第几位字符 c#项目决定成败 c# 与matlab c# xml缩进 c#传感器基础 c#操作wps c# md5使用方法 c# 引用父窗口的组件

相似问题

4
javascript如何用数组实现冒泡排序的算法,不用sort函数怎么实现?
11
来领C币了!请问javscipt里怎么实现div固定在屏幕顶上,滚动向下的话,它一直显示?
6
javascript中怎么实现求一个数组的中位数,求中位数的方式怎么实现的呢?
2
javascript怎么实现判断页面上的链接的功能,判断链接怎么用js语言实现呢?
9
javascript都来回答,怎么实现下拉选择日期的功能,JQ或者JS怎么实现?
3
javascript怎么实现对文本框的判断,在执行以后怎么判断一下,代码的实现怎么写?
7
javascript简单的问题,想要c币的都来回答:怎么在js网页中实现
2
javascript怎么实现网站的判断的功能,拿到一个界面以后如何返回判断界面的做法?
1
javascript怎么实现对onekey ghos的调用。而且需要制定分区的参数,怎么设置?
1
javascript怎么实现判断用户的计算机是否已经处于开机的状态了呢?如何判断状态?
2
javascript怎么实现调用api的功能,api调用功能的语句的格式是怎么样的?
2
javascript怎么实现箭头的界面,不是实现箭头函数,而是桃宝那种状态箭头?
1
javascript怎么实现对多个html+div实现的css的界面先判断后显示?
1
javascript怎么实现蒙特卡洛法计算圆周率的值?
0
javascript+unifia.js+ome怎么实现国标3码的过滤?
0
javascript怎么实现读取windows xp的电脑cdkey的功能?
4
C# js实现获取本地时间(不是服务器的时间)
0
swiper.js如何实现从上往下自动滚动啊?
1
javascript 怎么实现远程联机
0
js怎么实现页面数据排序 要求table里的第一列不参加排序??