POST 不提交并使用来自 POST 的临时数据填充输入字段

Question

我在代码中遇到了一些问题，想法是发布一些卡号并从其他服务器 API 获取有关此人的信息，然后使用一个按钮用我得到的数据填充由输入 ID 标识的一些输入字段从 API 获取而不将其保存到数据库中。

当前步骤：

1. PHP 表单 (1.php) -> 工作
2. 输入卡号 -> 成功
3. 将带有 Ajax 的卡号提交到其他 PHP 文件以从 API 获取响应（2.php，我也在这里回显结果）-> 工作
4. Div 弹出窗口（包含从 2.php 回显的响应）-> 有效
5. 使用一些按钮将数据从 2.php 填充到 1.php 多个输入字段

1.php

<script>
function checkcard()
    {
    var name=document.getElementById('card').value;
    var dataString='card='+ name;                                    
        $.ajax({                                     
               type:"POST",
               url:"../loader/2.php",                                
               data:dataString,                                  
               cache:false,
           success: function(html){
              $('#msg').html(html);
           }
    }) return false;    
       }
</script>

<div>
  <label class="col-form-label"><b>Card Number</b></label><br>                                       
  <input class="form-control" type="text" id="card" name="card">
</div>

<button type="submit" class="btn btn-primary mb-3" onclick="return 
  checkcard()">Check
</button>

<div id="msg">
</div>

<label class="col-form-label"><b>NICK</b></label><br>                                           

<input class="form-control" type="text" id="nick" name="nick">

<script type="text/javascript">                                                   
  function autoFill() {                                                      
  document.getElementById('nick').value = <?php echo json_encode($nick); ?>;
}    </script>

<button type="button" class="btn btn-primary" onClick="autoFill(); return true;">

自动填充功能和按钮在 1.php 中，当我单击按钮时，什么也没发生，我也尝试将它放在 2.php 中，但是当我单击按钮时，页面刷新/重新加载并且响应是没了，不知道该怎么办？

Answer 1

通过在1.php 中使用<?php echo json_encode($nick); ?>，您将退回到PHP，除非您将整个1.php 文件提交回服务器以进行PHP 预处理，否则这是没有用的。

请记住，您已经通过 ajax 检索了2.php 的数据。您可以将该数据存储在全局变量中，以便整个1.php 都可以访问它。

这是1.php的重铸

<div>
  <label class="col-form-label"><b>Card Number</b></label><br>                                       
  <input class="form-control" type="text" id="card" name="card">
</div>

<button type="submit" class="btn btn-primary mb-3" onclick="return 
  checkcard()">Check
</button>

<div id="msg">
</div>

<label class="col-form-label"><b>NICK</b></label><br>                                           

<input class="form-control" type="text" id="nick" name="nick">

<button type="button" class="btn btn-primary" onclick="return autoFill()">

<script type="text/javascript">     
    var global_data = '';

    function checkcard()
    {
        var name = $('#card').val();
        var dataString ='card='+ name;                                   
        $.ajax({                                     
            type:"POST",
            url:"../loader/2.php",                               
            data:dataString,                                     
            cache:false,
            success: function(data){
                global_data = data;
                $('#msg').html(data);
           }
        }) 
        return false;   
    }                   

    function autoFill() {                                                        
        $('#nick').val(global_data);
        return false;
    }    
</script>

请注意，我使用的是 jQuery val() 方法而不是 JavaScript value 属性，并且我为 checkcard() 和 autoFill() 函数返回 false 以避免页面刷新。

Answer 2

尼克

函数自动填充（）{ var name=$('#nick').val(); windows.location.href = "../loader/1.php"?name=" + name; }