时间戳

首页 > 解决方案 > 如何根据另一个表单值显示表单域

javascript - 如何根据另一个表单值显示表单域

问题描述

我想知道如何设置表单，因此如果选择了一个选项，则会显示一个文本输入。

我在文本输入之后仅显示是否选择了选项“y”。

我怀疑这更像是 jquery/js 的事情，但我试图尽可能多地保留它的服务器端。

<label for="resetpw">Reset Password</label>
    <select name="resetpw">
        <option value"n">No</option>
        <option value="y">Yes</option>
            <? if($_POST['resetpw']=='y'){?><p><label for="password">Reset Password</label><input type="password" name="password"></p> <? };?>
    </select>

标签： javascriptjquery

解决方案

没有真正的理由在服务器端做客户端的事情。

例如，任何不涉及处理且不是敏感数据的内容。

事实上，您只是启用和禁用输入的可见性，您可以jQuery像我在下面的代码中那样简单地使用。

代码片段

    $("#resetpw_select").on("change", function() {
      if ($(this).val() == "y") {
        $("#input_").append("<input type='password' name='password'>");
      } else {
        $("#input_ input").remove();
      }
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="resetpw">Reset Password</label>

<select name="resetpw" id="resetpw_select">
  <option value="n">No</option>
  <option value="y">Yes</option>
</select>

<p id="input_"></p>

推荐阅读