如何将javascript变量发布到PHP文件以分配给PHP变量?

时间:2017-08-19 10:59:49

标签: javascript php html ajax

我有一个包含多张图片的网页。每个图像可以被同一个地方的其他图像替换。每个图像旁边都有一个表单来上传新图像。 重要的是必须使用固定名称替换新文件名,例如:cat.jpg变为image1.jpgdog.jpg变为image5.jpg,具体取决于所使用的表单。 我使用这个HTML代码作为第一张图片:

 <div class="w3-padding-8 w3-card-8 w3-center w3-third w3-container ">
                <div class="w3-padding-8 w3-card-8 w3-center w3-container"><img src="images/cat.jpg" class="w3-padding-8 style="width:100%"></div>
                <div class="w3-center w3-container">
                    <form method="POST" action="upload4.php" enctype="multipart/form-data">
                        <input type="file" multiple name="file[]" data-maxfilesize="5000000">
                        <input class="button-primary" type="submit" value="Submit 1">
                    </form>
                </div>
            </div>

在upload4.php中,我有这个代码来接收新文件。现在它为它指定了名称images/image1.jpg,但我需要一个带有新文件名的变量。

<?php 
$sentfile = 'images/image1.jpg';
if (is_array($_FILES['file']['name'])) {
    foreach($_FILES['file']['name'] as $k=>$filename) {
        $uploadfile = $sentfile;
        if (move_uploaded_file($_FILES['file']['tmp_name'][$k], $uploadfile)) {
            // ok
        } else {
            $error_message.= "Error while uploading file ".$filename."<br />";
        }
    }
} elseif(isset($_FILES['file']['name'])) {
    $uploadfile = $sentfile;
    if (move_uploaded_file($_FILES['file']['tmp_name'], $uploadfile)) {
        // ok
    } else {
        $error_message = "Error while uploading file ".$_FILES['file']['name']."<br />";
    }
}
?>

如何将images/image1.jpg分配给$sentfile? 我想我需要 AJAX ?但是怎么样? 我知道Javascript是客户端的,php是服务器端但是如何通信...

3 个答案:

答案 0 :(得分:1)

如果我已正确理解您的问题,您要问的是根据所使用的表格为上传的图像添加名称。

你可以添加

<input type="hidden" value="here goes the desired name of the image" name="desired name">

然后通过$_POST['desired_name']获取值。

答案 1 :(得分:0)

你不需要ajax这个

首先将输入标记更改为如下所示:

<input type="file" onchange="getNewName_one(this.value)" multiple name="file[]" data-maxfilesize="5000000">

然后在JS中创建一个函数:

<script>
function getNewName_one(str) {
  var break_path = str.split('\\');  // make sure the \\ is actually two inorder for it to work
  var len = break_path.length - 1;  // we need to get the last entry of the loop
  var filename = break_path[len]; // filename contains only the filename now;
  document.cookie = "newImageName_one="+filename;
}
</script>

然后立即更新php

<?php 

$sentfile = $_COOKIE['newImageName_one'];  
?>

如果你的文件名本身有问题;就像你在输入类型=&#34;文件&#34;中得到一些奇怪的名字一样只是评论它。谢谢。

答案 2 :(得分:0)

新表格:

<form>
    <input type="file" onchange="changeFile(this.value)" name="file[]" />
</form>

JS:

<script>
    function changeFile(val) {

    var break_path = val.split('\\');
    var len = break_path.length - 1; 
    var filename = break_path[len];

    var ajaxCall = new XMLHttPRequest();
    ajaxCall.onreadystatechange = function(){
          if (ajaxCall.readyState === 4 && ajaxCall.status === 200) {
             var response = ajaxCall.responseText;
          }
      };


      ajaxCall.open("GET", "upload.php?fileName="+filename, true);
      ajaxCall.send();
    }
</script>

**你只能使用一个文件upload.php ***

然后在upload.php文件中:

<?php

if(isset($_GET['filename'])) {

$sentfile = $_GET['filename'];

}
if (is_array($_FILES['file']['name'])) {
  foreach($_FILES['file']['name'] as $k=>$filename) {
    $uploadfile = $sentfile;
    if (move_uploaded_file($_FILES['file']['tmp_name'][$k], $uploadfile)) {
        // ok
    } else {
        $error_message.= "Error while uploading file ".$filename."<br />";
    }
   }
} elseif(isset($_FILES['file']['name'])) {
$uploadfile = $sentfile;
if (move_uploaded_file($_FILES['file']['tmp_name'], $uploadfile)) {
    // ok
} else {
    $error_message = "Error while uploading file ".$_FILES['file']['name']."<br />";
}
}

if($error_message != '') {
    echo 'Image Uploaded';
} else {
    echo $error_message;
}

?>