基于jQuery的日期选择控件(6)

function(e) {
//获取当前是否显示
var isshow = $(this).attr("isshow");
var me = $(this);
//如果显示着，则隐藏，用于处理点击一下picker显示，再点击picker隐藏的逻辑
if (cp.css("visibility") == "visible") {
cp.css(" visibility", "hidden");
}
//同样是如果显示着
if (isshow == "1") {
me.attr("isshow", "0");
//remover临时数据，因为是单例所以要表示当前是哪个input
cp.removeData("ctarget").removeData("cpk").removeData("indata").removeData("onReturn");
return false; //阻止冒泡
}
//如果隐藏着，获取input的值
var v = obj.val();
if (v != "") {
v = v.match(dateReg);//验证一下格式是否正确
}
if (v == null || v == "") {//格式不正确或为空则用当前日期
def.Year = new Date().getFullYear();
def.Month = new Date().getMonth() + 1;
def.Day = new Date().getDate();
def.inputDate = null
}
else {
//否则使用input的日期
def.Year = parseInt(v[1], 10);
def.Month = parseInt(v[3], 10);
def.Day = parseInt(v[4], 10);
def.inputDate = new Date(def.Year, def.Month - 1, def.Day);
}
//注册临时数据
cp.data("ctarget", obj).data("cpk", me).data("indata", def.inputDate).data("onReturn", def.onReturn);
//调用规则，返回可选的日期范围
if (def.applyrule && $.isFunction(def.applyrule)) {
var rule = def.applyrule.call(obj, obj[0].id);
if (rule) {
if (rule.startdate) {
cp.data("ads", rule.startdate);
}
else {
cp.removeData("ads");
}
if (rule.enddate) {
cp.data("ade", rule.enddate);
}
else {
cp.removeData("ade");
}
}
}
else {
//不存在则删除限制
cp.removeData("ads").removeData("ade")
}
//画月日历内容td了
writecb();
$("#BBIT-DP-T").height(cp.height());
//获取显示依附的对象
var t = def.showtarget || obj;
//获取对象的位置
var pos = t.offset();
//获取对象的高度
var height = t.outerHeight();
//日期选择框的位置是依附对象的位置加上本身高度
var newpos = { left: pos.left, top: pos.top + height };
//以下都是处理窗口边界问题
var w = cp.width();
var h = cp.height();
var bw = document.documentElement.clientWidth;
var bh = document.documentElement.clientHeight;
if ((newpos.left + w) >= bw) {
newpos.left = bw - w - 2;
}
if ((newpos.top + h) >= bh) {
newpos.top = pos.top - h - 2;
}
if (newpos.left < 0) {
newpos.left = 10;
}
if (newpos.top < 0) {
newpos.top = 10;
}
//强制默认是月日期视图
$("#BBIT-DP-MP").hide();
newpos.visibility = "visible";
cp.css(newpos); //移动到知道位置并显示
//cp.show();
$(this).attr("isshow", "1");
//给document注册单次的click事件，解决打开日期选择器后，点击其他位置，隐藏日期选择器的问题
$(document).one("click", function(e) {
me.attr("isshow", "0");
cp.removeData("ctarget").removeData("cpk").removeData("indata");
cp.css("visibility", "hidden");
});
return false;//组织冒泡
}

其他一些代码都是日期操作的函数，如上月下月等就不做介绍了，大家如果对代码上又任何问题都可以留言，我一定解答，最后是示例了 .

第一个示例是老老实实的演示Demo示例，有三种方式，也有调用方式的说明：
第二个示例是我写的日程管理控件中结合datepicker的应用（大家可以先看看这个）

位置是：

和

 

是datepicker在我的创造中的应用，最后如果你觉得这边文章对你有所帮助，那就点击一下【推荐】？
代码打包脚本之家

您可能感兴趣的文章: