特定の要素の既存の画像をクリックして、画像をアップロードしようとしています。
ユーザーが画像をクリックすると、ファイル アップロード ダイアログが表示され、ユーザーがファイル ダイアログから画像を選択すると、フォームは自動的にフォームを送信し、ページをリロードします。
ここに私が持っているいくつかのコードがあります:
$(document).ready(function() {
$('#profile').click(function(e){
$('#fileUploadField').click();
e.preventDefault();
});
header('Location: ' . $current_file);
});
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="profile" id="fileUploadField"> <input type="submit">
</form>
プロファイル div は、画像が含まれている場所です
画像を表示するコードは既にあります。ダイアログを開き、閉じるときにフォームを送信してページを更新するだけです。
ここに私の他のコードがあります:
<?php
if (isset($_FILES['profile']) === true) {
if (empty($_FILES['profile']['name']) === true) {
echo 'Please choose a file!';
} else {
$allowed = array('jpg', 'jpeg', 'gif', 'png');
$file_name = $_FILES['profile']['name'];
$file_extn = strtolower(end(explode('.', $file_name)));
$file_temp = $_FILES['profile']['tmp_name'];
if (in_array($file_extn, $allowed) === true) {
change_profile_image($session_user_id, $file_temp, $file_extn);
header('Location: ' . $current_file);
exit();
} else {
echo 'Incorrect file type. Allowed: ';
echo implode(', ', $allowed);
}
}
}
if (empty($user_data['picture']) === false) {
echo '<img src="', $user_data['picture'], '" alt="', $user_data['firstname'], '\'s Profile Image" style="height:100px">';
}
?>