javascript - 如何在 jquery 中将 img src 设置为 php session

Question

我已经用 php 创建了一个程序。在这个程序中，我想在 php 中提交表单之前预览上传的图像。这是我的 html 表单代码。

<form id="form1" enctype="multipart/form-data">
    <label>Upload your closeup photo</label>
    <input onchange="readURL(this);" type="file" name="myfile"/>
</form> 

<img alt="Image Display Here" id="test" src="assets/images/nopic.jpg" height="500px" width="450px" style="display:block;"/>

 <form  action = "matrimony_action.php" method="post" name = "matrimony" onsubmit="return validate()" enctype="multipart/form-data">
    <input class="btn btn-action pull-left" type="submit" value="Submit" name="submitted8" id="submitted8">
 </form>

这是我在“输入类型文件”上调用的 javascript 函数代码

function readURL(input) 
{
    if (input.files && input.files[0]) 
        {
            var reader = new FileReader();

            reader.onload = function (e) 
            {
                $('#test').attr('src', e.target.result);
                //$("#test").css("display", "block");
                $('#test').css({"display":"block"});
            }
            reader.readAsDataURL(input.files[0]);
        }
        $.session.set("img", "hello"); // i am not sure about this statement.
}

并在 php 文件中。我写了以下几行。

<?php
   $photo1 =  $_SESSION["img"];
   echo $photo1;
?>

图像在提交表单之前预览效果更好。最后我收到错误“ undefined index :img”。 请帮助我。

Answer 1

你应该只使用一种形式，这样 myfile 也会被发送到 matrimony_action.php，例如:

<form  action = "matrimony_action.php" method="post" name = "matrimony" onsubmit="return validate()" enctype="multipart/form-data">
    <label>Upload your closeup photo</label>
    <input onchange="readURL(this);" type="file" name="myfile"/>

    <input class="btn btn-action pull-left" type="submit" value="Submit" name="submitted8" id="submitted8">
</form>

<img alt="Image Display Here" id="test" src="assets/images/nopic.jpg" height="500px" width="450px" style="display:block;"/>

注意:您不需要 session ，因为 img 文件将与表单一起提交。

希望这对您有所帮助。