使用 Jquery 日期选择器获取日期 | 日期选择器获取日期

本文介绍了使用 Jquery 日期选择器获取日期的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试从我的 jquery 日期选择器的实现中获取日期，将其添加到一个字符串中并在我的 div 中显示生成的图像.然而，有些东西是行不通的.任何人都可以检查代码并查看它吗?

i am trying to get date from my implementation of jquery date picker, add it to a string and display the resulting image in my div. Something however is just not working. Can anyone check out the code and have a look at it?

代码应该从日期选择器中获取日期，将其组合在一个字符串中，该字符串具有显示标签所需的代码，图像位于/image 中，格式为 aYY-MM-DD.png, new到这个日期选择器，还不能完全理解.

The code is supposed to take the date from date picker, combine it in a string which is to have the necessary code to display tag, images are located in /image and in the format aYY-MM-DD.png, new to this date picker and can't quite get it down yet.

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

    <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.custom.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script>
    <script type="text/javascript">
        $(function(){
            // Datepicker
            $('#datepicker').datepicker({
                dateFormat: 'yy-mm-dd',
                inline: true,
                minDate: new Date(2010, 1 - 1, 1),
                maxDate:new Date(2010, 12 - 1, 31),
                altField: '#datepicker_value',
            });
            //hover states on the static widgets
            $('#dialog_link, ul#icons li').hover(
                function() { $(this).addClass('ui-state-hover'); },
                function() { $(this).removeClass('ui-state-hover'); }
            );
        });
        //var img_date = .datepicker('getDate');
            var day1 = $("#datepicker").datepicker('getDate').getDate();
            var month1 = $("#datepicker").datepicker('getDate').getMonth() + 1;
            var year1 = $("#datepicker").datepicker('getDate').getFullYear();
            var fullDate = year1 + "-" + month1 + "-" + day1;
    var str_output = "<h1><center><img src="/images/a" + fullDate + ".png"></center></h1><br/><br>";
    page_output.innerHTML = str_output;
    // writing the results to the div element (page_out)
    </script>
</head>
<body style="background-color:#000;color:#fff;margin: auto auto;">



    <!-- Datepicker -->

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

    <!-- Highlight / Error -->
    <p>Date Value: <input type="text" id="datepicker_value" /></p>
    <div id="page_output" style="text-align:center; margin-top:80px; margin-bottom:20px; "></div>


</body>

推荐答案

我认为您希望在日期选择器的初始化中添加一个 'onSelect' 事件处理程序，以便在用户选择日期时触发您的代码.在 jsFiddle

I think you would want to add an 'onSelect' event handler to the initialization of your datepicker so your code gets triggered when the user selects a date. Try it out on jsFiddle

$(document).ready(function(){
    // Datepicker
    $('#datepicker').datepicker({
        dateFormat: 'yy-mm-dd',
        inline: true,
        minDate: new Date(2010, 1 - 1, 1),
        maxDate:new Date(2010, 12 - 1, 31),
        altField: '#datepicker_value',
        onSelect: function(){
            var day1 = $("#datepicker").datepicker('getDate').getDate();
            var month1 = $("#datepicker").datepicker('getDate').getMonth() + 1;
            var year1 = $("#datepicker").datepicker('getDate').getFullYear();
            var fullDate = year1 + "-" + month1 + "-" + day1;
            var str_output = "<h1><center><img src="/images/a" + fullDate +".png"></center></h1><br/><br>";
            $('#page_output').html(str_output);
        }
    });
});

这篇关于使用 Jquery 日期选择器获取日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！