复选框和选项卡（代码几乎完成）

Question

如果选中了正确的复选框，我会尝试制作标签并消失。

我的代码有效，但是当我刷新页面或加载页面时，标签显示的时间为0.5秒，然后消失。可能是脚本延迟，但如何删除？我想启动webAdmin，webCSR，webClient隐藏，并使用复选框显示/隐藏。

https://i.gyazo.com/8ff29fe1679a89fd4e215f98ba71375d.png

我的HTML：

＆＃13;

＆＃13;

  //Start web* hidden
    $('#tab-webCSR').hide();
    $('#tab-webAdmin').hide();
    $('#tab-webClient').hide();
    //Hide/Show Branch tabs
    $('#hasWebCSR').change(function() {
            if($(this).is(":checked")) {
                $('#tab-webCSR').show();
            }
            else {
                $('#tab-webCSR').hide();
            }
    });
    $('#hasProfile7').change(function() {
        if($(this).is(":checked")) {
            $('#tab-profile7').show();
        }
        else {
            $('#tab-profile7').hide();
        }
    });
    $('#hasWebAdmin').change(function() {
        if($(this).is(":checked")) {
            $('#tab-webAdmin').show();
        }
        else {
            $('#tab-webAdmin').hide();
        }
    });
    $('#hasWebClient').change(function() {
        if($(this).is(":checked")) {
            $('#tab-webClient').show();
        }
        else {
            $('#tab-webClient').hide();
        }
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
                    <label>Deploy Apps:</label>
                    <div class="well">
                        <div class="checkbox">
                            <label><input type="checkbox" checked id="hasProfile7" name="hasProfile7">Profile7</label>
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" id="hasWebCSR" name="hasWebCSR">WebCSR</label>
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" id="hasWebAdmin" name="hasWebAdmin">WebAdmin</label>
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" id="hasWebClient" name="hasWebClient">WebClient</label>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <label>GitLab Branches:</label>
                    <ul class="nav nav-tabs">
                        <li class="active"><a data-toggle="tab" id="tab-profile7" href="#profile7">Profile7</a> </li>
                        <li><a data-toggle="tab" id="tab-webCSR" href="#webCSR">WebCSR</a></li>
                        <li><a data-toggle="tab" id="tab-webAdmin" href="#webAdmin">WebAdmin</a></li>
                        <li><a data-toggle="tab" id="tab-webClient" href="#webClient">WebClient</a></li>
                    </ul>

＆＃13;

＆＃13;

＆＃13;

Answer 1

如果您将选项卡的可见性设置为默认隐藏，则可能会有所帮助。我在您的标签中添加了一个样式display: none;。但是你必须在启动时初始化一次visiblity。

＆＃13;

＆＃13;

  //Start web* hidden
    $('#tab-webCSR').hide();
    $('#tab-webAdmin').hide();
    $('#tab-webClient').hide();
    //Hide/Show Branch tabs
    $('#hasWebCSR').change(function() {
            if($(this).is(":checked")) {
                $('#tab-webCSR').show();
            }
            else {
                $('#tab-webCSR').hide();
            }
    });
    $('#hasProfile7').change(function() {
        if($(this).is(":checked")) {
            $('#tab-profile7').show();
        }
        else {
            $('#tab-profile7').hide();
        }
    });
    $('#hasWebAdmin').change(function() {
        if($(this).is(":checked")) {
            $('#tab-webAdmin').show();
        }
        else {
            $('#tab-webAdmin').hide();
        }
    });
    $('#hasWebClient').change(function() {
        if($(this).is(":checked")) {
            $('#tab-webClient').show();
        }
        else {
            $('#tab-webClient').hide();
        }
    });

＆＃13;

<style>
  .nav-tabs li a {
    display: none;
  }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
                    <label>Deploy Apps:</label>
                    <div class="well">
                        <div class="checkbox">
                            <label><input type="checkbox" checked id="hasProfile7" name="hasProfile7">Profile7</label>
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" id="hasWebCSR" name="hasWebCSR">WebCSR</label>
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" id="hasWebAdmin" name="hasWebAdmin">WebAdmin</label>
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" id="hasWebClient" name="hasWebClient">WebClient</label>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <label>GitLab Branches:</label>
                    <ul class="nav nav-tabs">
                        <li class="active"><a data-toggle="tab" id="tab-profile7" href="#profile7">Profile7</a> </li>
                        <li><a data-toggle="tab" id="tab-webCSR" href="#webCSR">WebCSR</a></li>
                        <li><a data-toggle="tab" id="tab-webAdmin" href="#webAdmin">WebAdmin</a></li>
                        <li><a data-toggle="tab" id="tab-webClient" href="#webClient">WebClient</a></li>
                    </ul>

＆＃13;

＆＃13;

＆＃13;

Answer 2

在from pyodbc import connect import pandasas pd df = pd.read_csv('PathToMyCSVfile', sep=';', header=0) cnxn = connect(DRIVER = '{SQL Server}', SERVER = 'MyServer', DATABASE = 'MyDatabase') cursor = cnxn.cursor() for index, row in df.interrows(): cursor.execute("INSERT INTO MySchema.MyTable VALUES (?,?)", df['Col1'][index], def['Col2'][index] cnxn.commit() 代码中添加style="display:none;"，并在<ul>代码的开头添加以下代码：JavaScript

或者您只需将$(".nav-tabs").show() ;添加到要在页面加载时隐藏的style="display:none;"标记