在html中隱藏/顯示錶單？

我是新來的HTML和即時通訊試圖隱藏/顯示錶單，如果用戶勾選一個窗體出現在下面的框。在html中隱藏/顯示錶單？

我有一個表格，例如

Name : 
Username : 
Add More Users: (tickbox)

如果用戶蜱它下面的「添加更多用戶」，另一種形式的字段的名稱，用戶名，添加更多的用戶「出現。這怎麼可能？

來源

2011-09-13 Spike Lee

你使用jQuery？ –

您需要爲此使用腳本。

首先把你想顯示/隱藏一個<div id="myForm">標籤內，並與

然後附上它使用jQuery http://www.jquery.com形式（下載jQuery庫，並將其鏈接到您的網頁，並在添加事件頁面加載運行功能檢查，如果被選中組合框，然後執行：

("#myForm").toggle();

來源

2011-09-13 11:27:23 Ahmad

你不需要額外的div - 你可以直接添加一個id到表單元素 – whostolemyhat

HTML

<input type="checkbox" onclick="display(this)">Add more users</input> 
<div id="yourDiv"> ...other forms... </div>

的JavaScript

function display(e){ 
    if (e.checked) 
     document.getElementById('yourDiv').style.display = 'block'; 
    else 
     document.getElementById('yourDiv').style.display = 'none'; 
    }

一個更好的方法來做到這一點（感謝What）

HTML

<input id="more" type="checkbox">Add More Users</input> 
<div id="yourDiv"> ...other form... </div>

的JavaScript

window.onload = function() { 
    document.getElementById('more').onclick = function() { 
     if (this.checked) 
      document.getElementById('yourDiv').style.display = 'block'; 
     else 
      document.getElementById('yourDiv').style.display = 'none'; 
    } 
}

來源

2011-09-13 11:28:05 Simone

不應該onclick是displayElement（this）？而且你不應該使用內聯javascript - http://css.dzone.com/news/why-inline-css-and-javascript- - 使用事件處理程序代替 – whostolemyhat

快進5年，現在大家都在使用內聯JS通過稱爲JSX的HTML頂部的奇怪標記語言... – Simone

您可以使用.clone（）和.append（）（需要jQuery）。你有給名稱屬性像

<input type="text" name="test[]" />

來源

2011-09-13 12:01:35 ahmetertem

在html中隱藏/顯示錶單？

回答

相關問題