條件邏輯表格

Question

我試圖用一些條件邏輯來編程一個表單。我會給你們一個例子，我想要做什麼。

問題1：您是否有保修表格？

• 是
• 沒有

如果訪客按下是我想說明以下幾點：

問題2：購買日期？

• 在這裏寫下你的文字。

我得到了下面的代碼已經：

代碼問題1

 <div class="form-section-content2"> 
    <div class="first-label-column-1-grey"> 
     <div class="form-content"> 
      Garantie bewijs meegeleverd * 
     </div> 
    </div> 
    <div class="first-label-column-2-grey"> 
     <div class="form-content"> 
      <input class="form-field" type="radio" name="garantie" value="ja"> Ja</br> 
      <input class="form-field" type="radio" name="garantie" value="nee"> Nee 
     </div> 
    </div> 
</div> 

代碼問題2

<div class="form-section-content1"> 
    <div class="first-label-column-1-white"> 
     <div class="form-content"> 
      Aanschafdatum * 
     </div> 
    </div> 
    <div class="first-label-column-2-white"> 
     <div class="form-content"> 
      <input class="form-field-text" type="text" name="aanschafdatum"> 
     </div> 
    </div> 
</div> 

我tryed與PHP和JavaScript的東西，但不能讓它完成。如果你們能幫助我，那會很棒。

Answer 1

只要單擊單選按鈕，就可以使用JavaScript onChange事件來運行函數。然後，您可以根據點擊哪個按鈕來顯示<div>。

function displayQuestion(answer) { 
 

 
    document.getElementById(answer + 'Question').style.display = "block"; 
 

 
    if (answer == "yes") { // hide the div that is not selected 
 

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

 
    } else if (answer == "no") { 
 

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

 
    } 
 

 
}

<form name="feedback" action="javascript:void(0)"> 
 

 
    <label> 
 
    <input type="radio" id="yes" name="yesOrNo" value="yes" onchange="displayQuestion(this.value)" />Yes</label> 
 
    <label> 
 
    <input type="radio" id="no" name="yesOrNo" value="no" onchange="displayQuestion(this.value)" />No</label> 
 

 
    <div id="yesQuestion" style="display:none;"><br/> 
 
    Why did you choose yes? 
 
    <input type="text" placeholder="answer here . . . " /> 
 
    </div> 
 

 
    <div id="noQuestion" style="display:none;"><br/> 
 
    Why did you choose no? 
 
    <input type="text" placeholder="answer here . . . " /> 
 
    </div> 
 

 
<br/><br/><input type="submit"> 
 

 
</form>

希望幫助！