Question

我正在使用Jquery Datetimepicker。日期时间选择器的详细信息可在以下位置找到： DateTimePicker Details

此日期选择器设置为显示在Click上，并链接到输入框。 Asp Code如下所述：

<link type="text/css" href="css/jquery.datetimepicker.css" rel="stylesheet" />  
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.17.custom.min.js"></script> 
    <script src="js/jquery.datetimepicker.js" type="text/javascript"></script>  
     <script type="text/javascript">

            $(document).ready(function () {

                /*DatePicker initializations*/
                var DATEPICKER_FORMAT = 'm/d/Y';
                var DATETIMEPICKER_FORMAT = 'm-d-Y H:i:s';
                var TIMEPICKER_FORMAT = 'g:ia';
                $(function () {
                    $(".datepickerwithicon").datetimepicker({
                        format: DATEPICKER_FORMAT,
                        datepicker: true,
                        timepicker: false,
                        step: 1,
                        allowBlank: true,
                        closeOnDateSelect: true,
                        validateOnBlur: false
                    });

                    $(".datetimepickerwithicon").datetimepicker({
                        format: DATETIMEPICKER_FORMAT,
                        datepicker: true,
                        timepicker: true,
                        step: 5,
                        allowBlank: true,
                        closeOnDateSelect: true,
                        validateOnBlur: false
                    });

                    /* Append calendar icon image. */
                    $('.datepickerwithicon, .datetimepickerwithicon').each(function () {
                        var dateInput = $(this);
                        var newImgId = dateInput.attr('id') + '_icon';
                        $("<img/>", {
                            "src": "Images/calendar-icon.png",
                            "class": "ui-datepicker-trigger",
                            "id": newImgId
                        }).insertAfter(dateInput);

                        $('#' + newImgId).on('click', function () {
                            dateInput.datetimepicker('show');
                        });
                        dateInput.click(function (event) {
                            $('.xdsoft_datepicker.active .xdsoft_calendar').focus();
                        });
                    });


                });

            });

        </script>

</head>
<body>
    <form id="form1" runat="server">
        <table>
            <tr>
                <td>
                    <asp:Label ID="lbStart" runat="server" Text="Start :" ForeColor="Black"></asp:Label>&nbsp;
        <input type="text" id="StartDate" name="StartDate" runat="server" class="datetimepickerwithicon" />&nbsp;
                    </td>
                <td>`
                    <asp:Label ID="lbEnd" runat="server" Text="End :" ForeColor="Black"></asp:Label>&nbsp;
        <input type="text" id="EndDate" name="EndDate" runat="server" class="datetimepickerwithicon"/>&nbsp;
                    </td>
                </tr>
            </table>
    </form>
</body>

问题：IE 7上的点击事件中未显示日期时间选择器。但是，它适用于所有其他版本的IE，Chrome和Firefox。

关于如何使其在IE 7上运行的任何想法？

Answer 1

很抱歉迟到的回复，但我在这里尝试了同样的事情，我改变的唯一的事情是CSS和JS文件的路径。它对我来说很好。您能否向我提供您在IE中获得的错误消息？我可以解决这个问题并快速为您提供解决方案。：）

更新2：您好，这是我用于测试的代码。我已从您在问题中提供的来源下载了该插件，并将其作为HTML文件运行。你可以这样做，让我知道它是否适用于你的浏览器？真的很抱歉，如果我花了很多时间在这上面。

<!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>
<link type="text/css" href="css/jquery.datetimepicker.css" rel="stylesheet" />  
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.17.custom.min.js"></script> 
    <script src="js/jquery.datetimepicker.js" type="text/javascript"></script>  
     <script type="text/javascript">

            $(document).ready(function () {

                /*DatePicker initializations*/
                var DATEPICKER_FORMAT = 'm/d/Y';
                var DATETIMEPICKER_FORMAT = 'm-d-Y H:i:s';
                var TIMEPICKER_FORMAT = 'g:ia';
                $(function () {
                    $(".datepickerwithicon").datetimepicker({
                        format: DATEPICKER_FORMAT,
                        datepicker: true,
                        timepicker: false,
                        step: 1,
                        allowBlank: true,
                        closeOnDateSelect: true,
                        validateOnBlur: false
                    });

                    $(".datetimepickerwithicon").datetimepicker({
                        format: DATETIMEPICKER_FORMAT,
                        datepicker: true,
                        timepicker: true,
                        step: 5,
                        allowBlank: true,
                        closeOnDateSelect: true,
                        validateOnBlur: false
                    });

                    /* Append calendar icon image. */
                    $('.datepickerwithicon, .datetimepickerwithicon').each(function () {
                        var dateInput = $(this);
                        var newImgId = dateInput.attr('id') + '_icon';
                        $("<img/>", {
                            "src": "Images/calendar-icon.png",
                            "class": "ui-datepicker-trigger",
                            "id": newImgId
                        }).insertAfter(dateInput);

                        $('#' + newImgId).on('click', function () {
                            dateInput.datetimepicker('show');
                        });
                        dateInput.click(function (event) {
                            $('.xdsoft_datepicker.active .xdsoft_calendar').focus();
                        });
                    });


                });

            });

        </script>

</head>
<body>
    <form id="form1" runat="server">
        <table>
            <tr>
                <td>
                    <asp:Label ID="lbStart" runat="server" Text="Start :" ForeColor="Black"></asp:Label>&nbsp;
        <input type="text" id="StartDate" name="StartDate" runat="server" class="datetimepickerwithicon" />&nbsp;
                    </td>
                <td>`
                    <asp:Label ID="lbEnd" runat="server" Text="End :" ForeColor="Black"></asp:Label>&nbsp;
        <input type="text" id="EndDate" name="EndDate" runat="server" class="datetimepickerwithicon"/>&nbsp;
                    </td>
                </tr>
            </table>
    </form>
</body>
</html>

Answer 2

似乎问题与环境有关，并且无法使用环境中可用的浏览器实例。修补程序更新后问题得以解决，之后可以看到datetimepicker。

JQuery Datepicker不适用于IE 7

2 个答案: