条件逻辑形式

Jer*_*ink 1 html forms

我正在尝试使用一些条件逻辑编写一个表单。我会给你们一个例子,我想做什么。

问题 1:您有保修单吗?

  • 是的

如果访问者按是,我想显示以下内容:

问题二:购买日期?

  • 在这里写你的文字。

我已经得到以下代码:

代码问题 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>
Run Code Online (Sandbox Code Playgroud)

代码问题 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>
Run Code Online (Sandbox Code Playgroud)

我用 php 和 javascript 尝试了一些东西,但无法完成。如果你们能帮助我就太好了。

Dra*_*zah 8

onChange每当单击单选按钮时,使用 JavaScript事件运行函数。然后,您可以<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";

  }

}
Run Code Online (Sandbox Code Playgroud)
<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>
Run Code Online (Sandbox Code Playgroud)

希望有帮助!