Question

我创建了一个多阶段表单（向导），我想在最后一步显示输入文本中的所有信息（可以修改它），然后再验证

我尝试了很多但没有任何结果，我怎么能这样做？

我的代码

pool_shape[3]

pool

我试试这个，但它只是为了显示信息，但你不能修改它，我需要在输入文本中显示它

var fname, lname, age;

function _(x) {
  return document.getElementById(x);  
}

function processPhase1(){
    fname = _("firstname").value;
    lname = _("lastname").value;
    if(fname.length > 2 && lname.length > 2){
      _("phase1").style.display = "none";
      _("phase2").style.display = "block";
    }
    else {alert("Please Enter All Information");}
}

function processPhase2(){
    age = _("age").value;
    if(age.length >= 1){
      _("phase2").style.display = "none";
      _("show_info").style.display = "block";
    }
    else {alert("Please Enter All Information");}
}

<body>
  <div id="phase1">
    First Name : <input id="firstname" name="firstname"><br>
    Last Name : <input id="lastname" name="lastname"><br>
    <button onclick="processPhase1()">Next</button>
  </div>
  <div id="phase2">
    Age : <input id="age" name="age"><br>
    <button onclick="processPhase2()">Next</button>
  </div>
  <div id="show_info">
    First Name : <input id="firstname" name="firstname" value = ""><br>
    Last Name : <input id="lastname" name="lastname" value = ""><br>
    Age : <input id="age" name="age" value = ""><br>
    <button onclick="submit()">submit</button>
  </div>

Answer 1

我会做到这一点完全不同，但这就是你如何根据你已经写过的内容做到的。当您单击每个函数中的下一个按钮时，您希望获取（fname，lname或age）的值并将其值设置为最后一个值的值投入我对您的代码进行了一些修改，并使您成为JS BIN http://jsbin.com/sopikuzuri/edit?html,output

简单来说

每次调用新阶段函数（processPhase1）时，您都希望获取用户刚刚输入的值。

然后，您要将这些值设置为正确的<input />

所以，我能给出的最简单的例子是：
下面，用户将在该字段中输入一些数据。当他们点击submit phase 1 button时，我们将获取他们刚刚输入的值，并将该值设置为最后一个输入（供他们查看/编辑）

<input type="text" id="firstName"/>
<button id="submit">Submit Phase 1</button>

<input type="text" id="displayInput"/>
<script>
     $("#submit").click(function() {

          // getting the value of what the user typed in
          var fname = $("#firstName").value;

          // setting the value of the final box to the var above
          $("#displayInput").val(fname);

     });
</script>

Multiphase Form（向导）在提交之前显示所有信息

1 个答案: