0
我正在做這個學習練習，我仍然是PHP的初學者。我對javascript的瞭解甚至更少：重新加載圖片而無需重新加載頁面？
我正在編寫的腳本應允許用戶從其硬盤上載圖像，允許用戶通過頁面上的某些控件對其進行修改，然後顯示修改圖片。
目前，我只使用PHP來做到這一點，它需要用戶設置控件的參數，然後發佈它們（需要完整的頁面重新加載）。有人能指導我以更好的方式來做到這一點嗎？有沒有這樣的東西我可以看看？
如果我最終可以在用戶滑動控件時最終實時更新圖像，那就太好了。我在找javascript嗎？ AJAX？
這裏是我的代碼基本版本：與上傳過程相比
<?php session_start(); ?>
<html>
<head>
<script>
<?php
if(isset($_POST['upload_submit'])) { // PROCESS UPLOAD FORM//////////////////////////////////////////////////////
$tmp_file = $_FILES['file_upload']['tmp_name'];
$filename = basename($_FILES['file_upload']['name']);
$_SESSION['file_name'] = $filename; // load filename into SESSION so that it survives page reloads from POST
move_uploaded_file($tmp_file, $filename);
}
if(isset($_POST['process_submit'])){ // PROCESS CONTROL FORM//////////////////////////////////////////////////////
$im = imagecreatefromjpeg($_SESSION['file_name']);
imagefilter($im, IMG_FILTER_COLORIZE, $_POST['colred'], $_POST['colgreen'], $_POST['colblue'], $_POST['colalpha']);
imagejpeg($im, "newimage.jpg"); //output to file
imagedestroy($im); // free memory
$_SESSION['Modified'] = TRUE; // flag that the image has been modified so that the page will display newimage.jpg instead of original
}
?>
</script>
</head>
<body>
<?php
if(isset($_SESSION['Modified'])){ // Image has been modified at least once (display modified image. do not display upload form)
echo("<img src='newimage.jpg' width='400px'><br />");
}elseif(isset($_FILES['file_upload']['name'])) { // Image has been uploaded but not yet modified (do not display upload form)
echo("<img src=$filename . ' 'width=400px'><br />");
} else { // FIRST State that the form is in when the page is loaded. (No image uploaded so display upload form)
echo("<form action='index.php' enctype='multipart/form-data' method='POST'>
<input type='file' name='file_upload' />
<input type='submit' name='upload_submit' value='Upload' />
</form>");
}
echo("<form action='index.php' method='post'><br />"); // display form with 4 slider controls (Red, Green, Blue, Alpha) and a submit button
echo("<table>");
echo (isset($_POST['colred'])) ? "<tr><td>Red:</td><td> 0<input type='range' name='colred' min='0' max='255' value=" . $_POST['colred'] . ">255</td></tr>"
:"<tr><td>Red:</td><td> 0<input type='range' name='colred' min='0' max='255'>255</td></tr>";
echo (isset($_POST['colgreen'])) ? "<tr><td>Green:</td><td> 0<input type='range' name='colgreen' min='0' max='255' value=" . $_POST['colgreen'] . ">255</td></tr>"
: "<tr><td>Green:</td><td> 0<input type='range' name='colgreen' min='0' max='255'>255</td></tr>";
echo (isset($_POST['colblue'])) ? "<tr><td>Blue:</td><td> 0<input type='range' name='colblue' min='0' max='255' value=" . $_POST['colblue'] . ">255</td></tr>"
: "<tr><td>Blue:</td><td> 0<input type='range' name='colblue' min='0' max='255'>255</td></tr>";
echo (isset($_POST['colalpha'])) ? "<tr><td>Alpha:</td><td> 0<input type='range' name='colalpha' min='0' max='255' value=" . $_POST['colalpha'] . ">127</td></tr>"
: "<tr><td>Alpha:</td><td> 0<input type='range' name='colalpha' min='0' max='255' value='127'>255</td></tr>";
echo("</table>");
echo("<button name='process_submit'>Process</button>");
echo("</form>");
?>
</body>
</html>
嘗試使用JavaScript加載圖像。你甚至可以做預加載！ – www139 2014-11-23 03:19:16
PHP只會在頁面在瀏覽器中加載之前運行一次。之後，所有你可以用PHP做的是請求一個新的頁面（或者可能請求一個頁面與Ajax）。在任何情況下，你想使用JavaScript進行原位頁面處理。 – Octopus 2014-11-23 05:04:33