JavaScript枚举选择jquery插件代码实例


Posted in jQuery onNovember 17, 2020

某次做项目要实现一个功能:

按星期选择一个连续的时间范围 比如:周一到周五,周六到周日 或 周六到周三

聪明的朋友马上想出办法:用两个选项为周一到周日的下拉列表实现,对 那样可以,但是我觉得不够友好,

所以利用业余时间写下了这个jQuery小插件。

源码

用法: 鼠标点击开始/结束项(红色部分,可自定义)进行选择和取消选择

效果图:JavaScript枚举选择jquery插件代码实例 周一到周五

JavaScript枚举选择jquery插件代码实例 周六到周日

JavaScript枚举选择jquery插件代码实例 周日到周三

<html>
<head>
<title>daybox测试</title>
<script type='text/javascript' src='jquery.min.js'></script>
<script type='text/javascript' src='easyui.daybox.js'></script>
</head>
<body>
<div id='aDayboxDiv'></div>
<script type='text/javascript'>
$(function(){
 $('#aDayboxDiv').daybox({
          weeks: [{ text: '一', value: 2 }, { text: '二', value: 3 }, { text: '三', value: 4 },
              { text: '四', value: 5 }, { text: '五', value: 6 }, { text: '六', value: 7 },
              { text: '日', value: 1 }]
          });
 $('#aDayboxDiv').daybox('setValue', 0, 2);
});
</script>
</body>
</html>

运行结果:JavaScript枚举选择jquery插件代码实例

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
May 15 jQuery
jQuery复合事件结合toggle()方法的用法示例
Jun 10 jQuery
jQuery实现点击DIV同时点击CheckBox,并为DIV上背景色的实例
Dec 18 jQuery
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
jQuery 实现倒计时天,时,分,秒功能
Jul 31 jQuery
jQuery实现的模仿雨滴下落动画效果
Dec 11 jQuery
JQuery样式与属性设置方法分析
Dec 07 jQuery
jQuery实现消息弹出框效果
Dec 10 jQuery
jquery实现吸顶导航效果
Jan 08 jQuery
jQuery实现简单全选框
Sep 13 jQuery
jQuery实现容器间的元素拖拽功能
Dec 01 jQuery
jQuery实现可以扩展的日历
Dec 01 jQuery
如何在vue 中引入使用jquery
Nov 10 #jQuery
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 #jQuery
jQuery实现移动端扭蛋机抽奖
Nov 08 #jQuery
Jquery Fade用法详解
Nov 06 #jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 #jQuery
使用jQuery实现购物车
Oct 29 #jQuery
jQuery实现简单评论区功能
Oct 26 #jQuery
You might like
PHP4在WinXP下IIS和Apache2服务器上的安装实例
2006/10/09 PHP
浅析PHP关键词替换的类(避免重复替换,保留与还原原始链接)
2015/09/22 PHP
浅谈PHP匿名函数和闭包
2019/03/08 PHP
浅谈PHP无限极分类原理
2019/03/14 PHP
dojo 之基础篇
2007/03/24 Javascript
Javascript 闭包引起的IE内存泄露分析
2012/05/23 Javascript
zTree插件之单选下拉菜单实例代码
2013/11/07 Javascript
javascript算法题:求任意一个1-9位不重复的N位数在该组合中的大小排列序号
2015/04/01 Javascript
JavaScript编程学习技巧汇总
2016/02/21 Javascript
JS实现HTML标签转义及反转义
2020/04/14 Javascript
AngularJS 防止页面闪烁的方法
2017/03/09 Javascript
AngularJS实现根据不同条件显示不同控件
2017/04/20 Javascript
微信小程序 页面滑动事件的实例详解
2017/10/12 Javascript
vue.js 中使用(...)运算符报错的解决方法
2018/08/09 Javascript
js实现ajax的用户简单登入功能
2020/06/18 Javascript
Vue移动端项目实现使用手机预览调试操作
2020/07/18 Javascript
vue组件中传值EventBus的使用及注意事项说明
2020/11/16 Javascript
Python中用startswith()函数判断字符串开头的教程
2015/04/07 Python
windows下Python实现将pdf文件转化为png格式图片的方法
2017/07/21 Python
Django后台获取前端post上传的文件方法
2018/05/28 Python
浅谈Python接口对json串的处理方法
2018/12/19 Python
Python中的 is 和 == 以及字符串驻留机制详解
2019/06/28 Python
windows安装TensorFlow和Keras遇到的问题及其解决方法
2019/07/10 Python
python对绑定事件的鼠标、按键的判断实例
2019/07/17 Python
Python定时器线程池原理详解
2020/02/26 Python
Pycharm pyuic5实现将ui文件转为py文件,让UI界面成功显示
2020/04/08 Python
浅谈sklearn中predict与predict_proba区别
2020/06/28 Python
keras 自定义loss层+接受输入实例
2020/06/28 Python
使用CSS3设计地图上的雷达定位提示效果
2016/04/05 HTML / CSS
关于HTML5+ API plusready的兼容问题
2020/11/20 HTML / CSS
公司授权委托书样本
2014/09/15 职场文书
医德医风自我评价2015
2015/03/03 职场文书
2015年安全工作总结范文
2015/04/02 职场文书
2016年大学迎新工作总结
2015/10/14 职场文书
一封真诚的自荐信帮你赢得机会
2019/05/07 职场文书
Golang日志包的使用
2022/04/20 Golang