• ajax日期选择


    主页面

    <body>
    
    
    <input type="text" id="riqi" />
    
    <!-- 模态框(Modal) -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">日期选择</h4>
                </div>
                <div class="modal-body">
                    <select id="nian">
                    </select>
                    <select id="yue">
                    </select>
                    <select id="tian">
                    </select>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" id="sure">确定</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
    
    
    
    </body>

    然后写入js代码

    <script type="text/javascript">
    $("#riqi").click(function(){
            $('#myModal').modal('show');
            LoadNian();
            LoadYue();
            LoadTian();
        })
    $("#sure").click(function(){
            var nian = $("#nian").val();
            var yue = $("#yue").val();
            var tian = $("#tian").val();
            
            var str = nian+"-"+yue+"-"+tian;
            $("#riqi").val(str);
            $('#myModal').modal('hide')
        })
    
    
    </script>

    处理页面代码

    // JavaScript Document
    
    $(document).ready(function(e) {
        $("#nian").change(function(){
                LoadTian();
            })
        $("#yue").change(function(){
                LoadTian();
            })
    });
    
    //加载年份
    function LoadNian()
    {
        var date=new Date;
         var year=date.getFullYear(); 
        
        var str = "";
        
        for(var i=year-5;i<year+6;i++)
        {
            if(i==year)
            {
                str +="<option selected='selected' value='"+i+"'>"+i+"</option>";
            }
            else
            {
                str +="<option value='"+i+"'>"+i+"</option>";
            }
        }
        
        $("#nian").html(str);
        
        
    }
    
    //加载月份
    function LoadYue()
    {
        var date=new Date;
         var yue=date.getMonth()+1;
        
        var str = "";
        
        for(var i=1;i<13;i++)
        {
            if(i==yue)
            {
                str +="<option selected='selected' value='"+i+"'>"+i+"</option>";
            }
            else
            {
                str +="<option value='"+i+"'>"+i+"</option>";
            }
        }
        $("#yue").html(str);
    }
    
    //加载天
    function LoadTian()
    {
        var date=new Date;
        var tian = date.getDate();
        
        var zs = 31; //总天数
        var nian = $("#nian").val();
        var yue = $("#yue").val();
        if(yue == 4 || yue==6 || yue==9 || yue==11)
        {
            zs = 30;
        }
        else if(yue==2)
        {
            if((nian%4==0 && nian%100 !=0) || nian%400==0)
            {
                zs = 29;
            }
            else
            {
                zs = 28;
            }
        }
        

    完成

  • 相关阅读:
    struts2标签解释
    通过注册表修改XP默认登陆用户
    6类常见开机故障
    摩尔定律
    小红伞扫描病毒类型
    newInstance()方法和new关键字
    常见恶意软件种类及说明
    jquery1.9 中这些方法已经被删除(live、die、sub........)
    (转)Ubuntu下JDK7安装全过程并调试第一个带包的java程序
    js取消气泡事件、阻止浏览器的默认行为
  • 原文地址:https://www.cnblogs.com/xiaoming-6/p/6409720.html
Copyright © 2020-2023  润新知