By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
448,814 Members | 1,671 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 448,814 IT Pros & Developers. It's quick & easy.

FileSize - image

P: n/a
Ken
I would like to measure the fileSize of the image (without uploading it -
php).

I use:
var size_pic = document.getElementById('num1').childNodes[0].fileSize;
alert("size = " + size_pic);
which works on IE with one exception.

With a first time displayed image, the script displays a size= -1 The image
is displayed on the first pass. The fileSize script is located after the
img script.
var image_display=document.createElement('img');
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

The second pass is correct. size = 11479

Is this a cache problem? The first pass caches the file, the second pass
reads the file?

I tried running - var size_pic
=document.getElementById('num1').childNodes[0].fileSize; - twice but that
made no difference.

Is there a work around for this problem.

Is there a better way to measure filesize in JavaScript?

Have a good day!

Ken
Jul 23 '05 #1
Share this Question
Share on Google+
4 Replies


P: n/a
Ken wrote:
I would like to measure the fileSize of the image (without uploading it -


You asked this question a couple of weeks ago, the answer is still the
same - you can't. Read your thread of 9 Oct.

Zif.
Jul 23 '05 #2

P: n/a
Ken wrote:
I would like to measure the fileSize of the image (without uploading it -
php).

I use:
var size_pic = document.getElementById('num1').childNodes[0].fileSize;
alert("size = " + size_pic);
which works on IE with one exception.

With a first time displayed image, the script displays a size= -1 The image
is displayed on the first pass. The fileSize script is located after the
img script.
var image_display=document.createElement('img');
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

The second pass is correct. size = 11479

Is this a cache problem? The first pass caches the file, the second pass
reads the file?


No, the problem is that the file has not yet loaded by the time you attempt to
access it's size. Make the display of it's size dependant on the onload event of
the image.

var image_display=document.createElement('img');
image_display.onload = function() {
alert(this.fileSize);
}
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

Of course, you'll need to replace alert(this.fileSize) with something more
useful, perhaps create another node under the image and display the size there.

--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq

Jul 23 '05 #3

P: n/a
Ken
"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:41***************@agricoreunited.com...
Ken wrote:
I would like to measure the fileSize of the image (without uploading it - php).

I use:
var size_pic = document.getElementById('num1').childNodes[0].fileSize;
alert("size = " + size_pic);
which works on IE with one exception.

With a first time displayed image, the script displays a size= -1 The image is displayed on the first pass. The fileSize script is located after the img script.
var image_display=document.createElement('img');
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

The second pass is correct. size = 11479

Is this a cache problem? The first pass caches the file, the second pass reads the file?
No, the problem is that the file has not yet loaded by the time you

attempt to access it's size. Make the display of it's size dependant on the onload event of the image.

var image_display=document.createElement('img');
image_display.onload = function() {
alert(this.fileSize);
}
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

Of course, you'll need to replace alert(this.fileSize) with something more
useful, perhaps create another node under the image and display the size there.
--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq

Grant,
Thanks for the suggestion.
Works great.
Ken


Jul 23 '05 #4

P: n/a
Ken
"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:41***************@agricoreunited.com...
Ken wrote:
I would like to measure the fileSize of the image (without uploading it - php).

I use:
var size_pic = document.getElementById('num1').childNodes[0].fileSize;
alert("size = " + size_pic);
which works on IE with one exception.

With a first time displayed image, the script displays a size= -1 The image is displayed on the first pass. The fileSize script is located after the img script.
var image_display=document.createElement('img');
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

The second pass is correct. size = 11479

Is this a cache problem? The first pass caches the file, the second pass reads the file?
No, the problem is that the file has not yet loaded by the time you

attempt to access it's size. Make the display of it's size dependant on the onload event of the image.

var image_display=document.createElement('img');
image_display.onload = function() {
alert(this.fileSize);
}
image_display.src='file://' + field;
image_display.name = 'pict';
document.getElementById('num1').appendChild(image_ display);

Of course, you'll need to replace alert(this.fileSize) with something more
useful, perhaps create another node under the image and display the size there.
--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq

Grant,

This works but not like I want.

I am trying to determine the file size to test for size < max spec. The
script works for the first image but not for a second image which replaces
the first image if it is over spec.

Removing the onload... the script works but will not measure fileSize on the
first pass.

Any suggestions.

Ken

<input type=file size=65 name="picture1" onChange="image_size(this.value);"
Id="pt1">
<div id="image_size_display"></div>
<script type="text/javascript">
// Image size to be under max limit
function image_size(field){
if ((document.createElement) && (document.getElementById)) {
var image_display=document.createElement('img');
image_display.onload = function() { image_size = this.fileSize; }
image_display.src='file://' + field;
image_display.name = 'pict';
image_display.alt = 'image';

document.getElementById('image_size_display').appe ndChild(image_display);

alert("image_size = " + image_size);

if(image_size >2000000){alert("This picture ( file ) is geater than
2,000,000.\n\n" + "Select another picture or reduce the size of the picture
( file )")};
alert("test");

document.getElementById('image_size_display').remo veChild(image_display);
} }
</script>
Jul 23 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.