PHP 不刷新显示结果

Question

这里是 php 代码，我想在不刷新的情况下显示域是否可用在同一页面中

    <form id="" method="post" class="cont">
        <input type="text" name="domain_name" class="srchFld" placeholder=""/>
        <select class="tldFld" name="suffix"> <option value=".com">.com</option> <option value=".net">.net</option> <option value=".org">.org</option> <option value=".biz">.biz</option> <option value=".info">.info</option> <option value=".dz">.dz</option> </select>
        <div align="center"><button type="submit" name="check" class="srchBtn" id="loadbasic">Search</button></div>
    </form>

<?php
if(isset($_POST['check'])) {

 if (!empty($_POST['domain_name'])){
 $name_domain = trim($_POST['domain_name']).$_POST['suffix'];
 $response = @dns_get_record($name_domain, DNS_ALL);
 if(empty($response)){
 echo "<H2 style='color:green;' >Domain $name_domain is available.</H2>";

 }else{
 echo "<H2 style='color:red;'>Domain $name_domain has taken.</H2>";
 }
 }
 else {
 echo "<H2 style='color:red;'>Error: Domain name can not be left empty.</H2>";
 }
}
?>

当此代码运行时，它会刷新同一页面并显示域是否正常工作，而我想要的是在同一页面中加载所有内容预先感谢您的帮助

Answer 1

为了补充 David 所说的内容，您需要 Ajax。所以首先你可能想要将 PHP 代码取出到一个名为 processForm.php 的新文件中，然后将表单上的 action 属性设置为 action="processForm.php"，然后添加 Jquery CDN库到表单页面。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>。这是一个代码片段，只需在 jquery 库 CDN

之后添加

<script>
$(function() {
// Get the form.
var form = $('#domain-form');

// Set up an event listener for the domain form.
$(form).submit(function(event) {
  // Stop the browser from submitting the form so as to avoid page refresh
  event.preventDefault();
  var formData = $(form).serializeArray();
  var paramObj = {};
  $.each(formData, function(_, kv) {
    paramObj[kv.name] = kv.value;
  });
  var domainName = $(form).find('input[name="domain_name"]').val();
   if(domainName.length === 0) {
     form.prepend("<H2 style='color:red;'>Error: Domain name can not be left empty</H2>");
      return false;
   }
    // Submit the form using AJAX.
    $.ajax({
         type: 'POST',
         url: $(form).attr('action'),
         data: paramObj, // The data sent to the server
         dataType: 'json' // The data type expected of the server response.
         success: function(response) {
           if(response) {
             form.prepend("<H2 style='color:red;'>Domain " + domainName + " has taken.</H2>")
           } else {
             form.prepend("<H2 style='color:red;'>Domain " + domainName + " is available.</H2>")
         }
    })
  });
});
</script>

PHP 可能看起来像这样

<?php
  if(isset($_POST['check'])) {
    if ($_POST['domain_name']){
      $name_domain = trim($_POST['domain_name']).$_POST['suffix'];
      $response = @dns_get_record($name_domain, DNS_ALL);
      echo json_encode($response);
    }
  }

PHP 不刷新显示结果

PHP show result without refresh

html

javascript

php

refresh