在 HTML 中显示 PHP var（使用 jQuery）

Question

我正在寻找显示信息的最佳解决方案，这些信息存储在 PHP 变量（我从 MySQL 数据库中获取）中。

我正在考虑使用 jQuery。我的问题：

• 通过输入字段，我收到会员编号。
• 我使用 img 名称存储了一个名为 $imgMember 的新变量。

问题：

• 我想在用户每次在<div class="boxImageMember"> 输入数字时显示此图像（我已经通过 PHP 验证并为其创建了一个变量 ($imgMember)。
• 我应该如何访问它？我需要用 AJAX 存储这些变量吗？内部/外部 jQuery？还是我需要换个思路？我陷入了困境。

我完全坚持自己的处理方式。

HTML：

<div id="header">
 <div class="header-content">
  <img src="img/logo-dqmih.png" width="60px">
 </div>
</div>

<div class="container">

  <div class="boxImageMember">HERE I WANT TO DISPLAY A USER IMAGE</div>
  <div class="boxInformationMember"></div>

  <form action="" method="post">
   <input type="text" id="MemberNumberEntry" name="staffNumber">
   <button type="submit" name="action">
  </form>

</div>

jQuery：

$(document).ready(function() {
     $("#MemberNumberEntry").focus();

     $(document).on('submit',function(event, test){
       event.preventDefault(); // Don't refresh the page

       var MemberNumberEntry = $("#MemberNumberEntry").val();
       console.log(MemberNumberEntry);

       $(".boxImageMember" ).css("background-image", "url(../images/persons/NIT.jpg)"); // Change image (Not dynamic yet)

       $(".boxInformationMember" ).text("Hi Test, welcome!");

       // Reset value form entry
       $('#memberNumberEntry').val('');
    });
});

Answer 1

你的 jQuery 脚本会做这样的事情

$(document).ready(function() {
 $("#MemberNumberEntry").focus();

 $(document).on('submit',function(event, test){
   event.preventDefault(); // Don't refresh the page

   var MemberNumberEntry = $("#MemberNumberEntry").val();
   //console.log(MemberNumberEntry);
       $.ajax({
            url: '/your-php-script.php',
            method: 'POST',
            data: {
                MemberNumberEntry: MemberNumberEntry
            },
            success: function(response){
                //If call goes well, you use the image here.
            }
        });
   $(".boxImageMember" ).css("background-image", "url(../images/persons/NIT.jpg)"); // Change image (Not dynamic yet)

   $(".boxInformationMember" ).text("Hi Test, welcome!");

   // Reset value form entry
   $('#memberNumberEntry').val('');
});
});

您基本上是使用$_REQUEST 或$_POST 向您的PHP 脚本发送HTTP POST 请求，该请求将像普通发布请求一样接受图像ID。

有大量的 jQuery 配置选项，您可以查看文档here。有关在 PHP 和 AJAX 中处理图像的更多信息，this 答案很有用。