先後顯示錶單域。 （Javascript/CSS）

Question

沒有人知道如何在https://www.hioscar.com/get-oscar/2016/quote/上連續顯示錶單域嗎？它看起來像Javascript，但我找不到代碼。應該動畫，並應顯示下一個領域，而不是返回。有沒有這樣的框架？

親切的問候

Answer 1

你可以用jQuery來做到這一點。下面是一個基本的例子：

$(document).ready(function(){ 
 
\t $('#input1').on('keyup',function(){ 
 
    \t if ($('#input1').val().length === 5) { 
 
    \t $('#input2').show(); 
 
    } 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
<input id="input1"> 
 
</div> 
 
<div> 
 
<input id="input2" style="display:none;"> 
 
</div>

在此示例中，表單開僅示出一個字段。

在關鍵了，我們檢查，如果該字段的值的長度等於5

如果是，我們展示了第二場。

Answer 2

創建表單並僅顯示第一個輸入（使用css）。每個輸入字段填充後（可以通過多種方式完成，例如創建onclick或onblur事件）。之後，你可以顯示改變CSS的下一個輸入欄。

一個好方法是將'steps'設置爲表單字段上的ids os類，這樣您的顯示/隱藏字段的函數將接收它作爲參數以正確執行。