jQuery Jcrop 和 PHP 实际上仅在 IE9 中不裁剪图像?
Posted
技术标签:
【中文标题】jQuery Jcrop 和 PHP 实际上仅在 IE9 中不裁剪图像?【英文标题】:jQuery Jcrop and PHP not actually cropping the image in IE9 only? 【发布时间】:2012-10-17 18:07:15 【问题描述】:我的这个脚本有一个奇怪的错误,我现在不知道该去哪里。
用户上传一张图片,然后可以选择裁剪它。一旦他们裁剪它,php 应该调整图像的大小并存储它。
此脚本在 IE8、IE7、Chrome、Safari、Firefox 等中运行良好。在 IE9 中,它失败了;它根本不会调整图像的大小。您上传一张 500x300 的图片并对其进行裁剪,但最终还是会得到一张 500x300 的图片,但不会触发任何错误消息。
“if(imagejpeg($dst_r,$src,$jpeg_quality))”检查返回 true 并且它正在重定向,即使在 IE9 中也是如此,但它实际上并没有编辑图像。
所有的帖子变量都通过了;如果我添加一个 print_r($_POST);所有尺寸都很好。图片正在上传到 FTP,只是在 IE9 中没有调整大小。
任何帮助将不胜感激。
<?php
//assign src
$src = $uploadStoragePath.$_SESSION['USER']['user_id'].'/'.$_SESSION['crop_me'];
if ($_SERVER['REQUEST_METHOD'] == 'POST')
//set width/height
$targ_w = $targ_h = 125;
//set jpeg quality
$jpeg_quality = 90;
//open the jpeg
$img_r = imagecreatefromjpeg($src);
$dst_r = ImageCreateTrueColor( $targ_w, $targ_h );
//crop the jpeg
imagecopyresampled($dst_r,$img_r,0,0,$_POST['x'],$_POST['y'],$targ_w,$targ_h,$_POST['w'],$_POST['h']);
//header('Content-type: image/jpeg');
//save the file
if(imagejpeg($dst_r,$src,$jpeg_quality))
$_SESSION['GORB']['message'] = "Profile Picture Updated!";
$_SESSION['GORB']['tone'] = "happy";
header('Location: '.$siteConfigMainUrl.'db/?view=edit_profile_picture');
else
echo 'Image failed';
?>
<html>
<head>
<script src="<?php echo $siteConfigUrl; ?>display/js/jquery.min.js"></script>
<script src="<?php echo $siteConfigUrl; ?>display/js/jquery.Jcrop.min.js"></script>
<link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css" />
<script language="javascript">
function updateCoords(c)
$('#x').val(c.x);
$('#y').val(c.y);
$('#w').val(c.w);
$('#h').val(c.h);
;
function checkCoords()
if (parseInt($('#w').val())) return true;
alert('Please select a crop region then press submit.');
return false;
;
</script>
<script type="text/javascript">
jQuery(function($)
// create variables (in this scope) to hold the API and image size
var jcrop_api, boundx, boundy;
$('#target').Jcrop(
onChange: updatePreview,
onSelect: updatePreview,
aspectRatio: 1,
onSelect: updateCoords
,function()
// use the API to get the real image size
var bounds = this.getBounds();
boundx = bounds[0];
boundy = bounds[1];
// store the API in the jcrop_api variable
jcrop_api = this;
);
function updatePreview(c)
if (parseInt(c.w) > 0)
var rx = 125 / c.w;
var ry = 125 / c.h;
$('#preview').css(
width: Math.round(rx * boundx) + 'px',
height: Math.round(ry * boundy) + 'px',
marginLeft: '-' + Math.round(rx * c.x) + 'px',
marginTop: '-' + Math.round(ry * c.y) + 'px'
);
;
);
</script>
</head>
<body>
<div class="article">
<img src="<?php echo $uploadStoragePath.$_SESSION['USER']['user_id'].'/'.$_SESSION['crop_me'];?>" id="target" />
<br/>
<h1>Preview:</h1>
<div style="width:125px;height:125px;overflow:hidden;">
<img src="<?php echo $uploadStoragePath.$_SESSION['USER']['user_id'].'/'.$_SESSION['crop_me'];?>" id="preview" />
</div>
<form action="<?php echo $siteConfigUrl.'?view=crop_profile_picture'; ?>" method="POST" onsubmit="return checkCoords();">
<input type="hidden" id="x" name="x" />
<input type="hidden" id="y" name="y" />
<input type="hidden" id="w" name="w" />
<input type="hidden" id="h" name="h" />
<input type="submit" value="Crop Image" />
</form>
</div>
</body>
</html>
【问题讨论】:
error_log 也没有任何输出。如果我打开ini_set('display_errors', 1);
和error_reporting(E_ALL);
也不会输出任何错误。它仍然显示“个人资料图片已更新!”在 IE9 中,但它根本没有裁剪它。
【参考方案1】:
前几天我遇到了同样的问题。我用这个来解决。我希望这对你有用:
if ($_SERVER['REQUEST_METHOD'] == 'POST')
$targ_w = $_POST['w'];$targ_h = $_POST['h'];
$jpeg_quality = 100;
$image = $_POST['image'];
$dir = $_POST['rel'];
$imagen = $dir."/".$image;
$src = $imagen;
$img_r = imagecreatefromjpeg($src);
$dst_r = ImageCreateTrueColor( $targ_w, $targ_h );
imagecopyresampled($dst_r,$img_r,0,0,$_POST['x'],$_POST['y'],
$targ_w,$targ_h,$_POST['w'],$_POST['h']);
//header('Content-type: image/jpeg');
imagejpeg($dst_r, $dir.'/crop_'.$image.'', $jpeg_quality);
exit;
【讨论】:
以上是关于jQuery Jcrop 和 PHP 实际上仅在 IE9 中不裁剪图像?的主要内容,如果未能解决你的问题,请参考以下文章
Chrome 和 IE8 上的 Jcrop 问题 - 仅在页面刷新时才显示裁剪