在使用 AJAX 调用 PHP 脚本后，如何将其显示为 html 页面？

Question

我正在尝试调用一个php文件，它将显示一个 html 页面，使用我的 js 中的 AJAX。 这是我的 php 文件：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Snippet details</title>
</head>
<body>
    <?php
        error_reporting(E_ALL);
        ini_set('display_errors', 1);
        header('Access-Control-Allow-Origin: *');
        header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
    
        require "../server_detail.php";
    
        $con=mysqli_connect($server,$username,$pass);
        $connection=mysqli_select_db($con,$database);
    
        if(!$connection)
            echo "Connection to database failed! Please try again";
        else{
            $sql="SELECT `Snapshot` FROM `snippet` WHERE `Date`='".$_POST["date"].
                "' AND `newspaper`='".$_POST["newspaper"]."' AND `Subject_desc`='".$_POST["news_desc"]."'";

            $result = $con->query($sql);
            $temp=explode('.',$result->fetch_array()[0]);

            echo "<div style=
             'text-align:center; vertical-align: middle;
             background-color: #FFFFFF; margin: 0 auto !important; 
             min-height: 100%; padding: 0; width: 978px !important; overflow:auto;'>";

            echo "<h3>{$_POST['newspaper']}</h3>";
            if($temp[count($temp)-1]=="pdf" || $temp[count($temp)-1]=="PDF")
                echo "<iframe src='{$result->fetch_array()[0]}' height='200px'>";
            else
                echo "<img src='{$result->fetch_array()[0]}' height='200px'>";
            echo "<p>{$_POST["news_desc"]}</p>";
            echo "</div>";
        }
        $con->close();
    ?>
</body>
</html>

我试图从我的js调用这个脚本（当按下li时）：

document.querySelector('body').addEventListener('click', function(event) {
      if (event.target.tagName.toLowerCase() === 'li') {
        var str=event.target.innerText.split('-');
        $.ajax({
            url: '/all_backend_stuff/view_page.php',
            type: 'POST',
            data:{
                "date":document.getElementById("date").value,
                "newspaper":str[0],
                "news_desc":str[1]
            },
            success:function(response){
                window.open('/all_backend_stuff/view_page.php'); //shows that all my array keys are undefined 
            },
            complete:function(){}
        });
      }
});

我的 POST 变量显示为undefined 。 这是为什么？

Answer 1

访问 URL 的不同方式表现不同。

如果您使用<a href="...">那么浏览器将从 URL 加载数据并将其显示为新页面。

如果您使用<img src="..."> ，那么浏览器会从 URL 加载数据，并在当前页面的那个点内联显示图像。

如果您使用<iframe src="...">那么浏览器将从 URL 加载的数据显示在当前页面的一个框中的页面中。

如果您使用 Ajax，那么浏览器将从 URL 加载数据，并使其对 JavaScript 可用。

这就是Ajax的意义所在。

它不会将结果显示为新页面，因为 Ajax 设计为不这样做。

如果您想将结果显示为新页面，那么最好不要使用 Ajax 。 请改用常规<form>提交。

如果你坚持使用 Ajax 那么你需要处理你当前的数据，在你编辑问题之前，记录并使用它更改当前页面的 DOM 。 通常，当您执行此操作时，您需要请求 URL 和 Ajax，返回结构化数据（例如 JSON 格式），然后有选择地更新页面的某些部分，而不是加载一个全新的 HTML 文档。

在使用 AJAX 调用 PHP 脚本后，如何将其显示为 html 页面？

问题描述

1 个解决方案

解决方案1
1 2022-03-11 10:20:18

在使用 AJAX 调用 PHP 脚本后，如何将其显示为 html 页面？

问题描述

1 个解决方案

解决方案1 1 2022-03-11 10:20:18

解决方案1
1 2022-03-11 10:20:18