单击按钮执行 PHP 脚本而不刷新页面
P粉805107717
P粉805107717 2024-02-17 12:27:38
0
2
378

我在使用 PHP 和 JavaScript 时遇到问题。

目标:当调用 .js 文件中 HTML 按钮的事件侦听器时,应执行 .php 脚本,无需重新加载页面。

预期结果:单击按钮时,将执行 PHP 脚本。就我而言,来自 URL 的文件将被下载到服务器。

实际结果:我不知道如何从JavaScript文件调用PHP脚本。

我尝试使用 AJAX,但没有任何效果。而且我也不知道到底应该把 JQuery 的库引用放在哪里。

我还尝试使用表单,并在其中输入一个输入(type =“submit”),但是当调用 PHP 函数时,它会刷新页面,并且页面上显示客户端的所有内容都消失了。

HTML 按钮:

<button type="button" class="button" id="btnsubmit">Submit</button>
<img class="image" id="someimage">

JavaScript 事件监听器(我已将按钮和图像分配给变量):

btnsubmit.addEventListener("click", () => {
    someimage.src = "directory/downloadedimg.png";
});

PHP 脚本:

<?php
    $path = 'https://somewebsite.com/imagetodownload.png';
    $dir = 'directory/downloadedimg.png';
    
    $content = file_get_contents($path);
    $fp = fopen($dir, "w");
    fwrite($fp, $content);
    fclose($fp);
?>

所以一般来说,当单击按钮时我想执行以下操作:

  1. 使用 PHP 将图像从 URL 下载到我的服务器
  2. 使用 JavaScript 在 HTML 图像中显示来自服务器的图像(不是来自 URL,我知道这是可能的,但为了我的使用,我需要它来自服务器)

我尝试了@Abhishek 的答案,发现问题现在出在我的 php 文件中。它总是给我一个内部服务器错误。 您是否发现此代码中有任何错误,将图像从 $path (它是一个 URL)上传到我的服务器(serverdirectorypath 是 $image_url):

<?php
$params = $_POST['data'];
$path = $params['path'];
$image_url = $params['image-url'];
    
$content = file_get_contents($path);
$fp = fopen($image_url, "w");
fwrite($fp, $content);
fclose($fp);
?>

P粉805107717
P粉805107717

全部回复(2)
P粉547420474

不需要其他库,您可以使用 vanillaJs 来完成此操作。
你的误解来自:“如何用Js调用php并获取返回值”
从这里开始,您有一个例子: https://www.w3schools.com/php/php_ajax_php.asp
一旦您能够调用 PHP 脚本,您就完成了目标的 70%

P粉787820396

您可以执行以下操作。

  1. 在页面的头部/底部添加 jquery,例如
sssccc
  1. 使用 jquery AJAX 并调用您的 php 脚本,如下所示
$("#button-id").on('click',function(){
            var data = {"image-url" : "directory/downloadedimg.png","path" : "https://somewebsite.com/imagetodownload.png"};
            $.ajax({
              type: 'POST',
              url: "{hostname}/test.php",
              data: data,
              dataType: "json",
              success: function(resultData) { alert("success"); }
           });
        });
  1. 在您的 PHP 脚本 ex- test.php 中,使用如下代码来获取帖子参数。
$params = $_POST['data'];
    $path = $params['path'];
    $image_url = $params['image-url'];

并进行您想做的业务运营。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板