Question

我有2种形式：form1和form2。 form2被隐藏，当我单击验证按钮时，form1消失，而form2出现。 form1包含一个input1。当我单击验证按钮时，我希望将input1的值放在form2上的“ name：”之后。

<div id='form1'>
     <div class="form-group col-md-4 col-md-offset-4">
        <label>number day 1</label>
       <input type="text" id='input1' class="form-control" placeholder="name">
       <span id='error'>Input can not blank</span>
     </div> 
           <table class="table table-bordered">
   <tr>
      <td>aa</td>
      <td>bb</td>
      <td>cc</td>
      <td>dd</td>
   </tr>
   <tr>
      <td>ee</td>
      <td>ff</td>
      <td>gg</td>
      <td>hh</td>
   </tr>

</table>

 <div class="form-group col-md-offset-5 ">
    <button id="hide" class="btn btn-success " type="submit">valider</button>
  </div>
</div>
<!------table2 ------>
  <div id='form2'>
    <h4>name : </h4>
     <table class="table table-bordered">
     <tr>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
     </tr>
     <tr>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
        <td>rr</td>
     </tr>
    </table>
  </div>

代码jquery：

 $(document).ready(function(){
    $("#hide").click(function(){
  let value = $('#input1').val();

  if (value = ""){
     $('#error').show();
  }else{
      $("#form1").hide();
       $("#form2").show();


   }
    });

  });

Answer 1

如果我的理解正确，那么您缺少将姓名发送给其他表格的部分，对吗？如果这是问题所在，则由于您在第二个表单上没有输入，只需添加一个带有ID的<span id="thename"></span>，以便您可以选择它并从第一个表单中为其命名。从那里使用jQuery将名称值发送到整个范围。

$('#thename').text(value);

$(document).ready(function() {
  $("#hide").click(function() {
    let value = $('#input1').val();
    $('#thename').text(value);

    if (value = "") {
      $('#error').show();
    } else {
      $("#form1").hide();
      $("#form2").show();


    }
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<div id='form1'>
  <div class="form-group col-md-4 col-md-offset-4">
    <label>number day 1</label>
    <input type="text" id='input1' class="form-control" placeholder="name">
    <span id='error'>Input can not blank</span>
  </div>
  <table class="table table-bordered">
    <tr>
      <td>aa</td>
      <td>bb</td>
      <td>cc</td>
      <td>dd</td>
    </tr>
    <tr>
      <td>ee</td>
      <td>ff</td>
      <td>gg</td>
      <td>hh</td>
    </tr>

  </table>

  <div class="form-group col-md-offset-5 ">
    <button id="hide" class="btn btn-success " type="submit">valider</button>
  </div>
</div>
<!------table2 ------>
<div id='form2'>
  <h4>name : <span id="thename"></span></h4>
  <table class="table table-bordered">
    <tr>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
    </tr>
    <tr>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
      <td>rr</td>
    </tr>
  </table>
</div>

如何在jquery上显示输入的值？

1 个答案: