快捷導(dǎo)航

JavaScript枚舉選擇jquery插件代碼實(shí)例

更新時(shí)間：2020年11月17日 09:06:54 作者：dint

這篇文章主要介紹了JavaScript枚舉選擇jquery插件代碼實(shí)例,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

某次做項(xiàng)目要實(shí)現(xiàn)一個(gè)功能：

按星期選擇一個(gè)連續(xù)的時(shí)間范圍比如：周一到周五，周六到周日或周六到周三

聰明的朋友馬上想出辦法：用兩個(gè)選項(xiàng)為周一到周日的下拉列表實(shí)現(xiàn)，對(duì) 那樣可以，但是我覺(jué)得不夠友好，

所以利用業(yè)余時(shí)間寫(xiě)下了這個(gè)jQuery小插件。

源碼

用法: 鼠標(biāo)點(diǎn)擊開(kāi)始/結(jié)束項(xiàng)（紅色部分，可自定義）進(jìn)行選擇和取消選擇

效果圖：周一到周五

周六到周日

周日到周三

<html>
<head>
<title>daybox測(cè)試</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>

運(yùn)行結(jié)果：

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Javascript 獲取LI里的內(nèi)容
使用Javascript（簡(jiǎn)稱(chēng)JS）取得LI里的內(nèi)容(簡(jiǎn)單易懂的代碼實(shí)例)
2008-12-12
javascript取消文本選定的實(shí)現(xiàn)代碼
最近在做拖動(dòng)布局. 發(fā)現(xiàn)有文本選定的時(shí)候, 進(jìn)行拖動(dòng)很不好看.
2010-11-11
eslint 的三大通用規(guī)則詳解
這篇文章主要介紹了eslint 的三大通用規(guī)則詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2019-05-05
一道JS前端閉包面試題解析
這篇文章主要針對(duì)一道JS前端閉包面試題進(jìn)行解析，從例題出發(fā)詳細(xì)介紹JS前端閉包相關(guān)知識(shí)，感興趣的小伙伴們可以參考一下
2015-12-12
關(guān)于javascript中偽數(shù)組和真數(shù)組的一些小秘密
在javascript中,偽數(shù)組又稱(chēng)類(lèi)數(shù)組,是一個(gè)類(lèi)似數(shù)組的對(duì)象,是一種按照索引存儲(chǔ)數(shù)據(jù)且具有l(wèi)ength屬性的對(duì)象,下面這篇文章主要給大家介紹了關(guān)于javascript中偽數(shù)組和真數(shù)組的一些小秘密,需要的朋友可以參考下
2022-08-08
JavaScript實(shí)現(xiàn)封閉區(qū)域布爾運(yùn)算的示例代碼
這篇文章主要介紹了JavaScript實(shí)現(xiàn)封閉區(qū)域布爾運(yùn)算的示例代碼，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-06-06
微信小程序?qū)崿F(xiàn)井字棋游戲
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)井字棋游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-05-05
es6中的import導(dǎo)入模塊和 export導(dǎo)出模塊詳解
require 是 CommonJS 模塊系統(tǒng)中用于導(dǎo)入模塊的關(guān)鍵字,采用同步加載方式；而 import 和 export 是 ES6 模塊系統(tǒng)中用于導(dǎo)入和導(dǎo)出模塊的關(guān)鍵字,采用靜態(tài)加載方式,并且支持異步加載,這篇文章主要介紹了es6中的import導(dǎo)入模塊和 export導(dǎo)出模塊,需要的朋友可以參考下
2023-11-11
js改變透明度實(shí)現(xiàn)輪播圖的算法
這篇文章主要為大家詳細(xì)介紹了js改變透明度實(shí)現(xiàn)輪播圖的算法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-08-08
eval的兩組性能測(cè)試數(shù)據(jù)
最近對(duì)eval火爆的討論，教主 @Franky 和灰大 @otakustay 也給了精彩的數(shù)據(jù)分析,剛好之前也做過(guò)類(lèi)似的測(cè)試，我也跟風(fēng)湊個(gè)熱鬧，提供兩組數(shù)據(jù)供大家參考
2012-08-08