隱藏複選框，但保留它現有的

Question

你好，我已經創建了這個複選框，我怎麼能隱藏它？

<div class="checkbox"> 
      <label for="sendEmail"> 
       <g:checkBox name="sendEmail" checked="${sendEmail == 'on'}" 
       onchange="swapFieldsets(this, '#sa-email', '#sa-password')" /> 
       <g:message code="onBoard.noAccessEmail" default="Send Access Email" /> 
      </label> 
     </div> 

Answer 1

在你的style.css

，加

.checkbox{ 
    display:none; 
} 

注意：這會隱藏與類.checkbox的所有元素，所以你可能想改變它（或更好：給它一個id）

或做內聯：

<div class="checkbox" style="display:none;"> 
      <label for="sendEmail"> 
       <g:checkBox name="sendEmail" checked="${sendEmail == 'on'}" 
       onchange="swapFieldsets(this, '#sa-email', '#sa-password')" /> 
       <g:message code="onBoard.noAccessEmail" default="Send Access Email" /> 
      </label> 
     </div> 

，如果你想這樣做在JavaScript中，它看起來像THI （你必須給複選框一個ID）

document.getElementById("checkboxid").style.display = 'none'; 

Answer 2

你也可以通過javascript來做到這一點。給你的元素一個ID或隱藏它的名字或類。

document.getElementById("checkbox").style.visibility = "hidden"; 
    document.getElementsByName("checkbox").style.visibility = "hidden"; 
    document.getElementsByClassName("checkbox").style.visibility = "hidden"; 

如果你可以使用jQuery這也是可能的：

$('#checkbox').hide(); 

在this link看看以瞭解更多信息

看看this example，看你想要做什麼你元件。然後你可以選擇給出的答案。 :)