用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 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 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

使用显示= “无” 的代替能见度= “隐藏”

<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> 

编辑：

当您使用visibilt =隐藏它保持了空间，同时使用显示器=无你不保留这个空间。你可以使用jquery以同样的方式展示它，我的意思是$(item).show()