很急啊：javascript 关于限制图片大小的问题。

我想在我的网站实现这样一个功能：上传照片并显示出来，但要在显示时限制大小，并让图片不失真，我写了一个代码，但用不了：<javascriptlanguage="javasc... 我想在我的网站实现这样一个功能：上传照片并显示出来，但要在显示时限制大小，并让图片不失真，我写了一个代码，但用不了：
<javascript language="javascript">
var w=ownimage.offsetWidth;
var h=ownimage.offsetHeight;
var i=1;
var a=0;
var b=0;
var imgarray;
window.onload=function img(){
while(i){
if((w<=280)&&(h<=230)){
i=0;
}else{
a=w-1;
b=(w-a)/w;
h=h-h*b;
imgarray[0]=a;
imgarray[1]=h;
i=1;
}
}
return imgarray;
}
</script>
<body>
<img src="" name="ownimage" id="ownimage" width="<script language="javascript">document.write(img()[0]);</script>" height="<script language="javascript">document.write(img()[1]);</script>">
</body>
嗯，大家帮帮忙，看这个是哪里出问题了，或提供一下这个功能的代码（javascript 和php 的都可以），或者提出个思路也行，非常感谢，我是个菜鸟，所以请大家写详细一些。
不好意思啊，太着急，第一行写错了，应该是：
<script language="javascript">.
我后台用的是php，麻烦大家了，能不能把用后台程序的方法说的详细一些。
我在php中用getimagesize()这个函数,
$a=getimagesize(ownphoto.jpg);
$b=substr($a[3],6,7);
这样在变量$b中就获得了图片的真实的宽度（但宽度的数值两边有双引号，怎么都去不掉），但当我想强制把$b转化成数值型用于计算时，转后的$b的值为0，代码是：$b=(int)$b;。展开

 我来答

5个回答

#热议# 发烧为什么不能用酒精擦身体来退烧？

百度网友9c28b7f
2011-01-19

知道答主

回答量：7

采纳率：0%

帮助的人：1.1万

我也去答题访问个人页

关注

展开全部

已赞过 已踩过<

评论收起

百度网友88fd30c7a1
2011-01-16 · TA获得超过375个赞

知道小有建树答主

回答量：443

采纳率：0%

帮助的人：420万

我也去答题访问个人页

关注

展开全部

你说是上传图片时控制图片显示的大小,但你的代码看起来是页面加载时来控制图片的大小.

如果是第一种方式:你需要控制<input type="flie">这个标签,那么别想了,除非你的网站只支持ie6.因为这个标签涉及安全问题不能通过JavaScript这样的脚本来控制.你可以选择用FLEX来控制,但这就说远了.

如果是第二种方式,那么,你要先读出图片的真实大小,然后再通过代码来控制,也就是你用的window.onload这个方法,在加载时来计算并控制图片的大小.
首先: 你要给出实际图片的大小,也就是在<img>标签中的width和height中给实际的值.也就是说你要在后台来给出这些图片的实际值.
其实: 你才是在window.onlaod方法用来控制这些值.

PS :
一、你的代码有很多不规范的地方
1.var w=ownimage.offsetWidth;这样的用法是不规范的,最可靠的用法就是
//document.getElementById这个方法支持所有浏览器
var ownimage = document.getElementById("ownimage");
//然后再获得你图的宽度,高也是类似用法.
var w = ownimage.offsetWidth;
2. 你有图片的宽度windth属性上直接写JavaScript代码是完全错误的.
错:width="<script language="javascript">document.write(img()[0]);</script>"
对:width="123"这里设置的是像素值
二、如果你的网站不是纯静态的话，那么一定有后台代码，那你就直接用后台代码来控制图片的大小，然后直接显示在页面上就可以了，不用JavaScript来控制这么麻烦了。

不知不觉写了好多，仅供参考，希望可以帮到你吧。

已赞过 已踩过<

评论收起

小古而倾乐29
2011-01-16 · TA获得超过1724个赞

知道小有建树答主

回答量：1614

采纳率：0%

帮助的人：306万

我也去答题访问个人页

关注

展开全部

IE6，7，8，以及firefox没有兼容的！
特别是IE8，不能获得图片大小！
我写过兼容IE6,7和firefox的！
要的话，留言！
function getPath(obj) {
if (obj) {
//ie
if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
obj.select();
// IE下取得图片的本地路径
return document.selection.createRange().text;
}
//firefox
else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
if (obj.files) {
// Firefox下取得的是图片的数据
return obj.files.item(0).getAsDataURL();
}
return obj.value;
}
return obj.value;
}
}
//var imgObj=new Image();
function ajaxFileUpload(id,obj){
var value=$("#"+id).val();
var path=getPath(document.getElementById(id));
// alert(path);
//path=path.replaceAll("\\","/");
//alert(path);
if(value==null||value.length==0){
alert("请选择要上传的图片");
return ;
}
//var path=getPath();
var img=document.getElementById("indeximg");
var limit = 1024*1024;
var flag;
if(window.addEventListener){ // FF
//alert("ff");
img.src = document.getElementById(id).files[0].getAsDataURL();
setTimeout(function(){
if ( img.complete ) {

var fileObj=document.getElementById(id).files[0];
//alert(fileObj.fileSize);
if (fileObj.fileSize > limit) {
alert("图片太大,图片不能大于1M");
flag=false;
}else{
fileUpload(id,obj);
}
}},100);
}else{
var imgObj = new Image();
var b1=navigator.appVersion.match(/7./i)=="7." ? 'IE7' : 'other version';
var b2=navigator.appVersion.match(/8./i)=="8." ? 'IE8' : 'other version';
if(b1=="IE7"||b2=="IE8"){
// $("#indeximg").bind("load",function(){
// checkSizeInIE8(imgObj,id,obj,img);
// });
fileUpload(id,obj);
// imgObj.src = path;
// img.src=path;
// checkSizeInIE8(imgObj,id,obj,img);
}else{
img.src=path;
//$.post("checkSize.php",,function(data){
//alert(path);
// });
checkSize(id,img,obj);
/*$.post("checkSize.php",,function(data){
alert("size"+data);
});*/
}
}
}

function checkSizeInIE8(imgObj,id,obj,img){
//alert(imgObj.src);
if(imgObj.src.split("/")[imgObj.src.split("/").length-1].replaceAll("%20"," ")!=getPath(document.getElementById(id)).split("\\")[getPath(document.getElementById(id)).split("\\").length-1]){ //如果图像是未加载完成进行循环检测
alert("in 1 "+img.fileSize);
setTimeout(function(){
checkSizeInIE8(imgObj,id,obj,img);
},200);
}else if(imgObj.width==0||imgObj.height==0){
alert("in 2 "+imgObj.src+" "+img.height+" "+img.width+" "+img.fileSize);
setTimeout(function(){
checkSizeInIE8(imgObj,id,obj,img);
},200);
}else{
var width = imgObj.width;
var height = imgObj.height;
alert(width+"----"+height);
if(width*height>1024*1024){
alert("上传图片过大，上传的图片不能大于1M");
return;
}else{
fileUpload(id,obj);
}
}
}
function checkSize(id,img,obj){
setTimeout(function(){

if(img.fileSize==-1){
checkSize(id,img,obj);
}else if (img.fileSize > 1024*1024) {
alert("图片太大,图片不能大于1M");
}else if(img.src.split("/")[img.src.split("/").length-1].replaceAll("%20"," ")!=getPath(document.getElementById(id)).split("\\")[getPath(document.getElementById(id)).split("\\").length-1]){
alert(img.src+" "+$("#"+id).val());
checkSize(id,img,obj);
}else{
//alert("图片大小为"+parseInt(img.fileSize/1024)+"K");
fileUpload(id,obj);

}

},200);
}

已赞过 已踩过<

评论收起

匿名用户
2011-01-21

展开全部

这里有一个图片上传预览效果

可以设置预览大小的

你可以参考一下

参考资料： http://www.blueidea.com/common/shoutbox/redir.asp?3=u&id=11586

本回答被提问者采纳

已赞过 已踩过<

评论收起

匿名用户
2011-01-23

展开全部

可以

已赞过 已踩过<

评论收起

更多回答（3）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

很急啊：javascript 关于限制图片大小的问题。

其他类似问题

为你推荐：