Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/77.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery 刷新时javascript中的引导导航选项卡设置选项卡(';显示';)会导致屏幕闪烁_Jquery_Screen - Fatal编程技术网

Jquery 刷新时javascript中的引导导航选项卡设置选项卡(';显示';)会导致屏幕闪烁

Jquery 刷新时javascript中的引导导航选项卡设置选项卡(';显示';)会导致屏幕闪烁,jquery,screen,Jquery,Screen,我有一个MVC页面,大约每10秒刷新一次,这是使用javascript完成的,并返回JSON。我的第一个问题是在返回时,活动的设置不正确。我已经修复了这个问题,页面甚至恢复到刷新前的位置 我的问题是,当我将active tab设置为show(显示)时,屏幕会闪烁/不停地显示您想要的名称 这就是我正在做的 VehicleDetails.prototype.requestVehicleDetails = function () { var self = this;

我有一个MVC页面,大约每10秒刷新一次,这是使用javascript完成的,并返回JSON。我的第一个问题是在返回时,活动的设置不正确。我已经修复了这个问题,页面甚至恢复到刷新前的位置

我的问题是,当我将active tab设置为show(显示)时,屏幕会闪烁/不停地显示您想要的名称

这就是我正在做的

VehicleDetails.prototype.requestVehicleDetails = function () {
            var self = this;
            var active = $('#VehicleTabs li.active').text();
            if (active == "Alerts") {
                self.activeTab = 0;
            }
            if (active == "Overview") {
                self.activeTab = 1;
            }
            if (active == "Tires") {
                self.activeTab = 2;
            }

            $.ajax({
                type: 'GET',
                url: self.vehiclesUrl + "/VehicleDetails?id=" + self.chid + "&alertsPage=" + self.alertsPage + " &warningsPage=" +
                    self.warningsPage + "&activeTab=" + self.activeTab,
                cache: false,
                success: function (result) {
                    self.updateVehicleDetails(result);
                    $("#data-error-alert").hide();
                    self = null;
                },
                error: function (result) {
                    $("#data-error-alert").show();
                    self = null;
                }
            });
        };

VehicleDetails.prototype.updateVehicleDetails = function (result) {
            var self = this;
            self.vehicleDetails = result;
            $("#change-status-button").removeAttr("disabled");
            $("#change-assignments-button").removeAttr("disabled");
            var template = $.templates("#vehicle-deatils-template");
            var htmlOutput = template.render(result);
            $("#content-placeholder").html(htmlOutput);
            //set the active tab back to what it was
            this.showActiveTab(this.activeTab);....



VehicleDetails.prototype.showActiveTab = function (activeTab) {
            //this does not work to keep from blinking
            // on load of the page: switch to the currently selected tab           
            //var hash = window.location.hash;
            //$('#VehicleTabs a[href="' + hash + '"]').tab('show');
            if (activeTab === 0) {
                $('[href="#tabAlarms"]').tab('show');
            }
            if (activeTab === 1) {
                $('[href="#tabOverview"]').tab('show');
            }
            if (activeTab === 2) {
                $('[href="#tabTires"]').tab('show');
            }
        };
我尝试过其他的解决方案,比如

<style type="text/css">
    .js #VehicleTabs {
        display: none;
    }
</style>
<script type="text/javascript" src="/scripts/jquery.js"></script>
<script type="text/javascript">
    $('html').addClass('js');
</script>

.js#车辆ABS{
显示:无;
}
$('html').addClass('js');
但这只是隐藏了标签,并显示了第一个标签的数据,但我无法访问其他标签


任何帮助都将不胜感激。

我能够通过从tab div中删除活动类来修复页面刷新时的屏幕闪烁

<div id="tabAlarms" class="tab-pane fade in">
                @*<div id="tabAlarms" class="@(Model.ActiveTab == 0 ? "tab-pane fade in active" : "tab-pane fade in")">*@
                    <div class="row" id="alerts">
                        @Html.Partial("_Alerts", Model)
                    </div>
                </div>
                <!--Overview tab-->
                <div id="tabOverview" class="tab-pane fade in">
                @*<div id="tabOverview" class="@(Model.ActiveTab == 1 ? "tab-pane fade in active" : "tab-pane fade in")">*@
                    <div class="row" id="overview">
                        @Html.Partial("_Overview", Model)
                    </div>
                </div>
                <!--Tires tab-->
                <div id="tabTires" class="tab-pane fade in">
                @*<div id="tabTires" class="@(Model.ActiveTab == 2 ? "tab-pane fade in active" : "tab-pane fade in")">*@
                    <div class="row" id="tires">
                        @Html.Partial("_Tires", Model)
                    </div>

                </div>

@**@
@Html.Partial(“\u警报”,模型)
@**@
@Html.Partial(“_Overview”,Model)
@**@
@Html.Partial(“_轮胎”,型号)

可能有助于提供更多上下文,例如您使用的是哪个版本的引导。我使用的是3.3.4版本的引导