Размер картинки в JavaScript

@dkozh · Регистрация: 09.02.2010

Студворк — интернет-сервис помощи студентам

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html> 
<head>
<script language='javascript' type='text/javascript'>
var newimg = new Image();
    newimg.src = '';
function Validateim() { 
    newimg.src=''+document.newimgF.banerfile.value+''
    if (newimg.complete) {
    if (newimg.fileSize > 50000) {
    alert('Размер слишком большой. Не больше 50кб!!!');
    return false
    }
    else {
    if (newimg.width > 300) or (newimg.height > 150) {
    alert('Размер картинки должен быть по ширине 300, а по высоте 150 пикселов!!!');
    return false
    } else {
    return true
    } 
    }
} else {
 setTimeout('Validateim()',100);
}
}
</script>
</head>
<body>
<forM name='newimgF' action='amd.asp' onSubmit='return Validateim()'>
<input type='File' name='banerfile'>
<input type='submit'>
</form>
 
</body>
</html>

В чем ошибка. Я не знаток в JavaScript поэтому прошу помочь.

@vers · 19.10.2010, 10:39

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<script language='javascript' type='text/javascript'>
var newimg = new Image();
newimg.src = '';
function Validateim() { 
newimg.src=document.newimgF.banerfile.value;
if (newimg.complete) {
if (newimg.fileSize > 50000) {
alert('Ðàçìåð ñëèøêîì áîëüøîé. Íå áîëüøå 50êá!!!');
return false
}
else {
if (newimg.width > 300 || newimg.height > 150) {
alert('Ðàçìåð êàðòèíêè äîëæåí áûòü ïî øèðèíå 300, à ïî âûñîòå 150 ïèêñåëîâ!!!');
return false
} else {
return true
} 
}
} else {
setTimeout('Validateim()',100);
}
}
</script>
</head>
<body>
<forM name='newimgF' action='amd.asp' onSubmit='return Validateim()'>
<input type='File' name='banerfile'>
<input type='submit'>
</form>

@vers · 19.10.2010, 10:39

Извините...

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<script language='javascript' type='text/javascript'>
var newimg = new Image();
newimg.src = '';
function Validateim() { 
newimg.src=document.newimgF.banerfile.value;
if (newimg.complete) {
if (newimg.fileSize > 50000) {
alert('Размер слишком большой. Не больше 50кб!!!');
return false
}
else {
if (newimg.width > 300 || newimg.height > 150) {
alert('Размер картинки должен быть по ширине 300, а по высоте 150 пикселов!!!');
return false
} else {
return true
} 
}
} else {
setTimeout('Validateim()',100);
}
}
</script>
</head>
<body>
<forM name='newimgF' action='amd.asp' onSubmit='return Validateim()'>
<input type='File' name='banerfile'>
<input type='submit'>
</form>

@vers · 19.10.2010, 10:48

Кстати, не факт что fileSize будет работать ...

@dkozh · 19.10.2010, 11:13 **[ТС]**

Он работает. Только получается так. Я выбираю картинку 80 кб. и размеры 600, 500. Тоесть не подходящую. 1ый раз он размер считает как -1. Выдает ошибку. Потом только размер нормально считает, почему так ?

@vers · 19.10.2010, 11:27

Ну как тебе сказать ... картинка не успевает загрузиться первый раз ..
есть вариант другой:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<html> 
<head>
<script language='javascript' type='text/javascript'>
function validate () {
newimage.src = document.newimgF.banerfile.value;
}
function validatesize (imagesize) {
if (imagesize > 50000) {
alert ('Большой файл!!!');  newimage.src = null;
} else validatedimensions ();
}
 
function validatedimensions () {
if (newimage.width > 300 || newimage.height > 150) {
alert ('Проблемы с пикселами!!!');
newimage.src = null;
} else document.newimgF.submit();
}
</script>
</head>
<body>
<form name='newimgF' action='amd.asp'>
<input type='file' name='banerfile'>
<input type='button' value='Отпрваить' onClick='validate()'>
</form>
<img id=newimage src='' alt='' border='0' onLoad='validatesize(this.fileSize)' style='visibility: hidden;'>
</body>
</html>

Громоздко как то ....

Новые блоги и статьи Все статьи Все блоги /
Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .	Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование 8Observer8 05.03.2026 Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .	SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .	SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip Сканируйте QR-код на мобильном и вы увидите, что появится джойстик для управления главным героем. . . .
Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .	SDL3 для Web (WebAssembly): Сборка библиотек: SDL3, Box2D, FreeType, SDL3_ttf, SDL3_mixer и SDL3_image из исходников с помощью CMake и Emscripten 8Observer8 27.02.2026 Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .	SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .

@vers 3 / 3 / 6 Регистрация: 20.06.2010 Сообщений: 580
	19.10.2010, 10:48
	Кстати, не факт что fileSize будет работать ... 0

@dkozh 0 / 0 / 0 Регистрация: 09.02.2010 Сообщений: 8
	19.10.2010, 11:13 [ТС]
	Он работает. Только получается так. Я выбираю картинку 80 кб. и размеры 600, 500. Тоесть не подходящую. 1ый раз он размер считает как -1. Выдает ошибку. Потом только размер нормально считает, почему так ? 0