基于jQuery的日历控件【原创】

最新推荐文章于 2014-10-27 17:26:47 发布

原创最新推荐文章于 2014-10-27 17:26:47 发布 · 695 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #jQuery ui #日历

jQuery 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何利用jQuery的强大函数库实现一个方便使用的日历控件，避免使用.NET自带的繁琐日历控件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

接着上篇说，什么控件拉？就是基于jQuery强大的函数库的应用嘛！真的是太方便了！福音啊！从此不再需要使用傻乎乎的.net自带日历控件了。

上代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.9.1.js"></script>
<script src="jquery-ui.js"></script>
<link href="jquery-ui.css" rel="stylesheet" />
<script>
    $(function() {
        $( "#datepicker" ).datepicker({
		
        changeMonth:true,  //月份下拉列表
        changeYear: true,  //月份下拉列表
        minDate: "1d",   //可选最小日期
        //maxDate: "+10d",  //可选最大日期
        showOn: "both",    //点击图片和输入框都弹出面板
        buttonImage:"calendar.jpg",
        buttonImageOnly:true,
        showButtonPanel: true, //显示面板底部按钮
        closeTextType:"close", //关闭按钮文字
        currentText: "today",   //返回今天按钮文字
        dateFormat:"yy-mm-dd",
        dayNamesMin:['Sun','Mo','Tu','We','Th','Fr','Sa'],
		
        //beforeShow: function(event, ui) { //打开窗口之前
           //alert('this is from ifxoxo.com'); 
        //}//其他参数详见下面
    });
    });

</script>

</head>

<body>
Date: <input id="datepicker" type="text" />

</body>
</html>

再次感谢博友的文章(http://blog.csdn.net/dearkerwin/article/details/9922947)，更多更细节的关于日历的应用讲解都在那里了。