zoukankan      html  css  js  c++  java
  • Datepicker控件

    jQuery UI(http://jqueryui.com/)是在jQuery基础上开发的开源JavaScript网页可视化控件库,其功能主要实现用户的基本界面、交互、动画、特效,以及可以更换主题等可视化控件。

    jQuery UI为基本界面控件建立了17种主题的样式,如果开发者需要特定的主题,可以使用ThemeRoller应用程序设置个性化的主题样式。

    要使用Datepicker日期选择控件,首先需要在页面<head>标签中引入相关的JavaScript类库,实现代码如下:

    <link type="text/css" href="http://www.cnblogs.com/Scripts/css/smoothness/jquery-ui-1.7.2.custom.css" rel="stylesheet" /> 
      <script type="text/javascript" src="http://www.cnblogs.com/Scripts/js/jquery-1.3.2.min.js"></script>
      <script type="text/javascript" src="http://www.cnblogs.com/Scripts/js/jquery-ui-1.7.2.custom.min.js"></script>

    对应的文件目录如下:

    我们要使用的是Datepicker控件

    所以要在<head>标签中定义该JavaScript方法

    如下:

    <script type="text/javascript">
          $(function() {
              $('#datepicker').datepicker({
                  inline: true
              });
          });
       </script>

    在需要使用该Datepicker控件的地方添加语句

    <div id="datepicker"></div>

    即可。

    效果如下

    如有需要可以在

    $('#datepicker').datepicker({
                  inline: true

              });

    语句块中添加额外的方法

    如:

    $('#datepicker').datepicker({
                  changeMonth:true,changeYear:true
          
              });

    将changeMonth和changeYear设置成true,可以再日期选择控件的工具栏中显示年和月的下拉列表框,便于用户设置不同年,月的日期,

    上述代码的运行效果如下:

  • 相关阅读:
    dedecms自定义表单提交获取时间跟ip地址
    JQuery购物车多物品数量的加减+总价计算
    jquery手机触屏滑动拼音字母城市选择器代码
    js实现图片上传实时显示
    js实现发送验证码倒计时效果
    JS 仿支付宝input文本输入框放大组件
    js实现倒计时效果
    jquery统计输入文字的个数并对其进行判断
    【Linux】Linux系统安全设置
    java泛型(generics)
  • 原文地址:https://www.cnblogs.com/nero/p/1597968.html
Copyright © 2011-2022 走看看