用htmlhelpers动态创建div？

Question

我的MVC应用程序出现问题，如图所示。

因此，当我点击其中一个复选框时，脚本将被设置为div到visible的可见内容。但这不是一个好主意，因为第二个div上面有一个空白区域。

带有脚本insdie的复选框：

    <label><input type="checkbox" onclick="biurowyScript();" id="biurowyCheck" />  Pracownik biurowy</label>
            <label><input type="checkbox" onclick="przewodnikScript();" id="przewodnikCheck" style="margin-left: 30px" />   Przewodnik</label>

biurowy div

   <div id="biurowy" style="visibility: hidden">
            <div class="form-group">

                @Html.LabelFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.Pracownik_biurowy, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>

przewodnik div：

 <div id="przewodnik" style="visibility: hidden">
            <div class="form-group">
                @Html.LabelFor(model => model.Przewodnik.Uprawnienia, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.Przewodnik.Uprawnienia, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.Przewodnik.Uprawnienia, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>

在脚本中，我只将div的可见设置为visible。但就像我说这不是这个应用程序的好主意。那么我可以用它来解决这个问题呢？

Answer 1

使用 display =＆＃34; none＆＃34; 代替 visibility =＆＃34;隐藏＆＃34;

getResource

编辑：

当你使用visibilt = hidden时它会保留空间，而使用display = none则不会保留空间。您可以用jquery以相同的方式显示它，我的意思是<div id="biurowy" style="display: none"> <div class="form-group"> @Html.LabelFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, htmlAttributes: new { @class = "control-label col-md-2" }) <div class="col-md-10"> @Html.EditorFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Pracownik_biurowy, "", new { @class = "text-danger" }) </div> </div> </div>