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