如何在HTML中創建基於其他字段值更改的字段

-1

我必須根據其他字段的值快速創建具有可選菜單的表單。我無法在純HTML中找到任何東西。這可能只與HTML有關嗎？如何在HTML中創建基於其他字段值更改的字段

2012-03-23 user1258361

我能想到的唯一方法是服務器端。對於每一個條件，它會在提交後顯示一個新的表單（所有的邏輯將在提交後，服務器端完成），但是當你可以使用Javascript時，這是瘋狂的。 – jackJoe 2012-03-23 18:29:40

純HTML可能不符合該任務（除非HTML5中有新的動態功能，我不知道這是完全可能的）。但是對於JavaScript（特別是使用jQuery時），根據表單的狀態動態顯示/隱藏/更改表單元素和頁面部分非常簡單。

你會做的是將事件監聽器附加到驅動動態內容的表單元素，這些監聽器會相應地顯示/隱藏/更改頁面元素。您可以在一個人爲的例子here看看：

HTML：

<div id="firstSection"> 
    <select id="selectSomething"> 
     <option>Select...</option> 
     <option>One</option> 
     <option>Two</option> 
    </select> 
</div> 
<div id="optionalSection"> 
    <select id="selectSomethingElse"> 
     <option>Select...</option> 
     <option>Three</option> 
     <option>Four</option> 
    </select> 
</div>

CSS：

#optionalSection 
{ 
    display: none; 
}

的JavaScript：

$('#selectSomething').change(function() { 
    if ($('#selectSomething').val() == 'Two') { 
     $('#optionalSection').show(); 
    } else { 
     $('#optionalSection').hide(); 
    } 
});

從本質上講，第二部分有條件地取決於顯示關於第一部分目前選擇的內容。

請注意，從服務器的角度來看，所有的表單元素仍然會發布它們的值。這種方法不會阻止第二部分被包含在表單中，而只是被顯示給用戶。在服務器端處理表單結果時，您仍然希望相應地重新驗證業務邏輯。（永遠不要假設用戶有效的內容。）

來源

2012-03-23 18:39:22 David

我不認爲這是可能的只有HTML，但JavaScript應該工作。

來源

2012-03-23 18:26:55

如何在HTML中創建基於其他字段值更改的字段

回答

相關問題