Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
指定した時間の範囲外のときに、HTML要素を非表示にしたり、disabledにしたりするjQueryプラグイン
(function($){
$.fn.offDayTime = function( options ) {
// Extend settings
var settings = $.extend({
behavior : 'hide',
openTime : 900,
closeTime : 1700,
closeDays : [0, 6] // 0:Sun, 6:Sat
}, options);
// Flag
var flag = function() {
// Now time
var date = new Date($.now());
var nowDay = date.getDay();
var nowHour = date.getHours().toString();
var nowMin = ('00' + date.getMinutes()).slice(-2);
var nowTime = parseInt(nowHour + nowMin, 10);
// Day off
if ($.inArray(nowDay, settings.closeDays) !== -1)
return false;
// Time off
if (nowTime < settings.openTime || nowTime > settings.closeTime)
return false;
// Day and Time on !!
return true;
}();
// Core
return this.each(function() {
// Escape $(this)
var element = $(this);
if (!flag) {
switch (settings.behavior) {
case 'hide':
element.css('display', 'none');
break;
case 'disabled':
element.attr('disabled', true);
break;
default:
element.css('display', 'none');
break;
}
}
});
};
}(jQuery));
<script src="/path/to/jquery.js"></script>
<script src="/path/to/jquery.offdaytime.js"></script>
<script>
jQuery(function($) {
// Default
$('#foo').offDayTime();
// Use Options
$('#bar').offDayTime({
behavior : 'disabled',
openTime : 1200,
closeTime : 2000,
closeDays : [3]
});
});
</script>
<p id="foo">Office Hours!</p>
<button id="bar">Send Message</button>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment