MVC 中的 Datepicker 在 IE 中加载缓慢答案

【问题标题】：Datepicker in MVC loads slowly in IEMVC 中的 Datepicker 在 IE 中加载缓慢
【发布时间】：2018-01-18 21:37:19
【问题描述】：

我的 IE 用户体验有问题（是的，我知道 - 失败的原因）。我的网站在 Mozilla 和 Chrome 上运行良好，但每次打开或关闭日期选择器菜单时，chrome 都会浪费 1-2 秒。

这是我的 jQuery：

<script>
            $(document).ready(function () {
                $('#IssDate').datetimepicker({
                    theme: 'dark',
                    lang: 'bg',
                    format: 'd.m.Y H:i:s',
                    minDate: '-1970/02/01',
                    maxDate: '+1970/01/08',
                    step: 10,
                    dayOfWeekStart: 1,
                    showAnim: jQuery.support.boxModel ? 'drop' : null, // optional
                    duration: jQuery.support.boxModel ? 'normal' : ''
                });
            });
        </script>
        <script>
            $(document).ready(function () {
                $('[id $= _Date]').datetimepicker({
                    theme: 'dark',
                    lang: 'bg',
                    format: 'd.m.Y H:i:s',
                    step: 10,
                    dayOfWeekStart: 1,
                    showAnim: jQuery.support.boxModel ? 'drop' : null, // optional
                    duration: jQuery.support.boxModel ? 'normal' : ''
                });
            });
        </script>

你能给我推荐一个解决方案吗？我已经看过 WebApp cmets 但我真的不知道这是否是同一个问题。我已经尝试删除 datepicker 的一些功能，但效果没有任何明显变化。

我相信即使是保管箱和文本字段也确实很慢，但还不错。

【问题讨论】：

这不会真正影响您的问题，但您可以通过将两个日期选择器调用放在单个 document.ready 处理程序中的单个 <script> 标记中来整理代码
“加载缓慢”是主观的。您需要分析页面元素的加载情况以定位瓶颈。

标签： c# jquery asp.net-mvc internet-explorer datepicker

【解决方案1】：

我找到了解决办法！

原来，我的脚本中有递归。我有一个 (document).on('change') 函数，它改变了一些字段。再说一次，当这些字段发生变化时，我有另一个 jQuery 来检查它们的变化并触发其他字段的变化。他们在这里：

 $(document).on('change', function () {
                    if ($("#sol_Date").val().trim() != '') {
                        $("#caseStatus").val('Solved');
                        $("#caseStatusDisplay").val('Solved');
                        $("#caseStatus").change();
                    }
                    else {
                        $("#caseStatus").val('In Progress');
                        $("#caseStatusDisplay").val('In Progress');
                        $("#caseStatus").change();
                    }
                });



$(document).ready(function () {
                $("#falsePositives").change(function () {
                    if ($("#caseStatus").val().trim() == 'Solved' && ($("#falsePositives").val().trim() != '' || $("#escTo").val().trim() != '' || $("#dept").val().trim() != '')) {
                        $("#saveBtn").attr('disabled', false);
                        $("#escToValMsg").text('');
                        $("#fpValMsg").text('');
                    }
                    else if ($("#caseStatus").val().trim() == 'Solved' && $("#falsePositives").val().trim() == '' && $("#escTo").val().trim() == '' && $("#dept").val().trim() == '') {
                        $("#escToValMsg").text('You must have either escalated to/department or false positives filled');
                        $("#fpValMsg").text('You must have either escalated to/department or false positives filled');
                        $("#saveBtn").attr('disabled', true);
                    }
                });
            });

如您所见，这会导致无休止的循环。其他浏览器足够聪明地注意到它并在第一次执行时跳过整个过程。另一方面，IE 每次更改字段值时都必须触发循环。修改函数后，一切顺利。

PS：我没花 2 周时间 :) 在这里填写我的评论太晚了。

【讨论】：