如何在ajax和php中传递具有可变值的图像文件



我正在PHP和AJAX上传到一个文件夹和消息值(任何文本框和文本区值)的图像。代码是通过ajax和PHP图像上传工作,但我不知道如何传递消息变量值。

<!DOCTYPE html>
<body>
<span id="msg" style="color:red"></span><br/>
<textarea name="message" class="form-control" id="message"></textarea>
<input type="file" id="photo"><br/>
<button class="btn btn-success" id="save">Save</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document).on("click", "#save", function () {
var message = $("#message").val();
var property = document.getElementById('photo').files[0];
var image_name = property.name;
var image_extension = image_name.split('.').pop().toLowerCase();
if(jQuery.inArray(image_extension,['gif','jpg','jpeg','']) == -1){
alert("Invalid image file");
}
var form_data = new FormData();
form_data.append("file",property);
$.ajax({
url:'insert2.php?'+message,
method:'POST',
data:form_data,
contentType:false,
cache:false,
processData:false,
beforeSend:function(){
$('#msg').html('Loading......');
},
success:function(data){
console.log(data);
$('#msg').html(data);
}
});
});
});
</script>
</body>
</html>

图片正在上传到文件夹中,但是当我点击保存按钮时消息是未定义的。

<?php
if($_FILES['file']['name'] != ''){
$test = explode('.', $_FILES['file']['name']);
$extension = end($test);    
$name = rand(100,999).'.'.$extension;
$location = 'testimg/'.$name;
move_uploaded_file($_FILES['file']['tmp_name'], $location);
echo '<img src="'.$location.'" height="100" width="100" />';
echo $message = $_POST['message'];
}

?>

它在PHP页面上给我未定义的消息值。截图

使用ajax传递文件和框值的最佳方法是什么?

$_POST['message']没有定义,因为您没有在FormData对象中放置一个名为message的属性。如果您一开始就没有将其提交给服务器,那么您就不能期望在POST变量中存在某些内容。

您只需要将它添加到表单数据中:

form_data.append('message', message);

url:'insert2.php?'+message

没有意义(因为它没有创建一个有效的querystring)。改成

url:'insert2.php?'

最新更新