| |
|
|
| | Всем привет!
Подскажите пожалуйста как сделать графическую имитацию обработки информации (текст + картинки) и загрузки её на сервер моего сайта.
Текстовая информация и картинки
<input name="foto1" type="file" class="pole" size="80" maxlength="80">
|
добавляется в форму "form1" на странице, которая так же является обработчиком данной формы.
После нажатия кнопки
...name="dobavity" type="submit"...
|
в первую очередь происходит проверка заполнения обязательных полей формы (JS), количество символов в поле и пр., в случае ошибок весь скрипт останавливается и выводится сообщение.
Если ошибок нет, то происходит обработка изображений (если есть):
// Загрузка фото на сервер
if (!empty ($_FILES["foto1"]['name']))
{
// Проверка размера файла
if ($_FILES['foto1']['size'] > 10000000) {exit ("<br><span class = 'ohibka'>Размер изображения №1 более 10 Мб.!</span>");}
// Проверяем тип файла
if(!preg_match('/[.](JPG)|(jpg)|(gif)|(GIF)|(png)|(PNG)$/',$_FILES['foto1']['name']))//проверка формата исходного изображения
{
exit ("<br><span class = 'ohibka'>Не верный тип изображения №1!</span>");
}
// Каталог для фото
$catalog = "foto/";
$uploadfoto1 = $catalog.basename($_FILES['foto1']['name']);
$filename1 = $_FILES['foto1']['name'];
// Копируем файл из каталога для временного хранения файлов:
copy($_FILES['foto1']['tmp_name'], $uploadfoto1);
if(preg_match('/[.](GIF)|(gif)$/',$filename1))
{
$im = imagecreatefromgif($uploadfoto1) ;
//если оригинал был в формате gif, то создаем изображение в
// этом же формате. Необходимо для последующего сжатия
}
if(preg_match('/[.](PNG)|(png)$/',$filename1))
{
$im = imagecreatefrompng($uploadfoto1) ;
//если оригинал был в формате png, то создаем
//изображение в этом же формате. Необходимо для
//последующего сжатия
}
if(preg_match('/[.](JPG)|(jpg)|(jpeg)|(JPEG)$/',$filename1))
{
$im = imagecreatefromjpeg($uploadfoto1);
//если оригинал был в формате jpg, то создаем изображение в
//этом же формате. Необходимо для последующего сжатия
}
// Создание маленького изображения №1
$size1 = getimagesize($_FILES['foto1']['tmp_name']);
$raznica1 = $size1[0]/93; //Заданная ширина картинки 100
$w_src1 = imagesx($im)/$raznica1; //Вычисляем ширину и высоту картинки
$h_src1 = imagesy($im)/$raznica1;
$dest1 = imagecreatetruecolor($w_src1,$h_src1);
imagecopyresampled($dest1,$im,0,0,0,0,$w_src1,$h_src1,imagesx($im),imagesy($im));
$date1 = microtime();
//вычисляем время в микросекундах в настоящий момент.
imagejpeg($dest1,$catalog.$date1.".jpg");
//сохраняем изображение формата jpg в нужную папку, именем
//будет текущее время. Сделано, чтобы не было одинаковых
//имен.
//почему именно jpg? Он занимает очень мало места +
//уничтожается анимирование gif изображения, которое
//отвлекает пользователя. Не очень приятно читать его
//комментарий, когда краем глаза замечаешь какое-то движение
$delful1 = $catalog.$filename1;
unlink($delful1);//удаляем оригинал загруженного изображения
$foto1_mini = "$catalog$date1.jpg";//заносим в переменную путь до фото
// Создаём большое изображение №1
$size2 = getimagesize($_FILES['foto1']['tmp_name']);
// Если ширина картинки больше 500 то уменьшаем ее размер
//до 500 пикселей, если нет то оставляем размер без изменений
if (($size2[0] > 600))
{
$raznica2 = $size2[0]/600; //Заданная ширина картинки 500
$w_src2 = imagesx($im)/$raznica2; //Вычисляем ширину и высоту картинки
$h_src2 = imagesy($im)/$raznica2;
$dest2 = imagecreatetruecolor($w_src2,$h_src2);
imagecopyresampled($dest2,$im,0,0,0,0,$w_src2,$h_src2,imagesx($im),imagesy($im));
$date2 = microtime();
imagejpeg($dest2,$catalog.$date2.".jpg");
$foto1_big = "$catalog$date2.jpg";//заносим в переменную путь до фото.
}
else
{
$w_src2 = imagesx($im);
$h_src2 = imagesy($im);
$dest2 = imagecreatetruecolor($w_src2,$h_src2);
imagecopyresampled($dest2,$im,0,0,0,0,$w_src2,$h_src2,imagesx($im),imagesy($im));
$date2 = microtime();
imagejpeg($dest2,$catalog.$date2.".jpg");
$foto1_big = "$catalog$date2.jpg";//заносим в переменную путь до фото.
}
}
|
и в конце страницы загрузка всей информации на мой сервер:
$result3 = mysql_query ("INSERT INTO doska
(date_ok,date_podachi,date_end,dostup,tip,razdel,
podrazd,region,gorod,marka,model,year,cvet,probeg,
objem,toplivo,korobka,ruly,privod,dvizhok,ls,
zagolovok,price,valuta,foto_mini1,foto_mini2,
foto_mini3,foto_mini4,foto_mini5,foto_big1,
foto_big2,foto_big3,foto_big4,foto_big5,
text_obyavl,user,isq,e_mail,checkbox,telefon,
ip_adres,ip_servera) VALUES('$date_ok','$date_podachi','$date_end','$dostup',
'$tip','$razdel','$podrazd','$region','$gorod',
'$marka','$model','$year','$cvet','$probeg',
'$objem','$toplivo','$korobka','$ruly','$privod',
'$dvizhok','$ls','$zagolovok','$price','$valuta',
'$foto1_mini','$foto2_mini','$foto3_mini','$foto4_mini',
'$foto5_mini','$foto1_big','$foto2_big','$foto3_big',
'$foto4_big','$foto5_big','$text_obyavl','$user',
'$isq','$e_mail','$checkbox','$telefon','$ip',
'$ip_servera')");
// Проверяем, есть ли ошибки
if($result3=='TRUE')
{....}
|
Т.к. скрипт обработки изображений занимает много времени, нужно как то графически имитировать процесс обработки изображений и загрузки всей информации на сервер. | |
| |
|
|
| |
|
|
| |
для: sega_z
(25.10.2011 в 11:31)
| | | Попробовал подключить к кнопке :
<input name="dobavity" type="submit" class="knopka" id="dobavity" value="Разместить" onclick="img()">
<div id="load" align="center"></div>
<script>
function img()
{
document.getElementById('load').innerHTML = '<br><span class="text_sin">Обязательно дождитесь окончания загрузки объявления!!!</span>';
}
</script>
Но он выводит текст сразу после нажатия кнопки, как его подключить к скрипту обработки изображения и загрузки файлов в базу данных? | |
| |
|
|
| |
|
|
| |
для: sega_z
(25.10.2011 в 12:23)
| | | А вот зачем так растягивать сообщение?!! | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(25.10.2011 в 14:27)
| | | Простите, но хотелось бы услышать от вас совета. | |
| |
|
|
| |
|
|
| |
для: sega_z
(25.10.2011 в 14:58)
| | | Обнаружил следующий код, но не могу понять как он работает и как его подключить к моему скрипту?
<html>
<head>
<style type="text/css">
div {
margin: 1px;
height: 20px;
padding: 1px;
border: 1px solid #000;
width: 275px;
background: #fff;
color: #000;
float: left;
clear: right;
top: 38px;
z-index: 9
}
.percents {
background: #FFF;
border: 1px solid #CCC;
margin: 1px;
height: 20px;
position:absolute;
width:275px;
z-index:10;
left: 10px;
top: 38px;
text-align: center;
}
.blocks {
background: #EEE;
border: 1px solid #CCC;
margin: 1px;
height: 20px;
width: 10px;
position: absolute;
z-index:11;
left: 12px;
top: 38px;
filter: alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: .5
}
</style>
</head>
<body>
<?php
if (ob_get_level() == 0) {
ob_start();
}
echo str_pad('Loading... ',4096)."<br />\n";
$d = 0;
$m = 0;
for($i = 0; $i < 25; $i++) {
$d += 11;
$m += 10;
echo '<div class="percents">' . $i*4 . '% complete</div>';
echo '<div class="blocks" style="left: '.$d.'px"> </div>';
flush();
ob_flush();
sleep(1);
}
ob_end_flush();
?>
<div class="percents" style="z-index:12">Done.</div>
</body>
</html>
|
Кто нибудь может его прокомментировать? | |
| |
|
|
| |
|
|
| |
для: sega_z
(25.10.2011 в 15:59)
| | | >Простите, но хотелось бы услышать от вас совета.
Да нет Вам прощения!!! Вам было удобно читать Ваше же растянутое сообщение? )))
А по поводу обнаруженного скрипта...
Попробуйте его запустить отдельно от всего остального и посмотрите как он работает.
Не совсем понятна строка
<?php
echo str_pad('Loading... ',4096)."<br />\n";
?>
|
да и переменная $m тоже не понял зачем здесь...
В остальном....
в цикле for создаётся основной div и 25 дополнительных div, которые при каждой новой итерации цикла добавляются в основной на смещение $d пикселей + строка с текстом сколько % загружено + в конце каждой итерации скрипт "усыпляется" на одну секунду, что и создаёт впечатление движущейся строки...
вот как то так ))) объяснил как мог )))
Что бы подключить к форме попробуйте начать с этого
<?php
if(isset($_POST['load'])){
// тут проверьте правильность заполнения полей формы
// и если нет ошибок, то продолжите обработку ....
if (ob_get_level() == 0) {
ob_start();
}
//echo str_pad('Loading... ',4096)."<br />\n";
$d = 0;
//$m = 0;
for($i = 0; $i < 25; $i++) {
$d += 11;
//$m += 10;
echo '<div class="percents">' . $i*4 . '% complete</div>';
echo '<div class="blocks" style="left: '.$d.'px"> </div>';
flush();
ob_flush();
sleep(1);
}
ob_end_flush();
}
else{
echo "<form action='' method='post'>
<button type='submit' name='load'>Загрузить</button>
</form>";
}
?>
|
| |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(26.10.2011 в 15:06)
| | | Спасибо, попробую подключить. | |
| |
|
|
| |
|
|
| |
для: sega_z
(26.10.2011 в 16:19)
| | | Нет что то не работает.
А можете подсказать простой скриптик, чтобы затемнял экран и показывал крутилку. Который бы запускался сразу после проверки полей формы и до обработки фотографий и загрузки информации на сервер.
У меня все скрипты выполняются на одной странице и в следующей последовательности: проверка форм - обработка фото - обработка текстовой информации - загрузка всей информации на сервер.
Заранее благодарен!!! | |
| |
|
|
| |
|
|
| |
для: sega_z
(26.10.2011 в 17:01)
| | | и что именно не работает?
приведите кусок кода, но только НЕ ПОЛНОСТЬЮ !!!
Например, пусть будет пару input + их проверка + подключение скрипта с визуальной загрузкой и всё.
Посмотрим и поможем если сможем )))
Второй вариант, чтобы затенялся экран и показывал .gif картинку можно сделать при помощи jquery. подключение этого варианта будет таким же как и первого...
так что давайте, показывайте...
разберётесь с первым вариантом - сделаете и второй ))) | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(26.10.2011 в 18:12)
| | | Вот примеры полей формы:
<input name="zagolovok" type="text" class="pole" value="<?php echo @$_POST['zagolovok'] ?>" size="93" maxlength="60"
tooltipText="Содержимое заголовка и текста объявления используется в быстром поиске по сайту, поэтому указывайте максимум необходимых слов." required>
<input name="foto1" type="file" class="pole" size="80" maxlength="80">
<textarea name="text_obyavl" cols="70" rows="5" class="pole" id="text_obyavl" required><?php echo @$_POST['text_obyavl'] ?></textarea>
<input name="dobavity" type="submit" class="knopka"
title="Нажав данную кнопку, вы соглашаетесь с нашими правилами пользовательского соглашения и правилами размещения объявлений"
id="dobavity" value="Разместить объявление" onclick="img()">
|
Далее идёт обработка полей (если нажата кнопка "dobavity"):
<?php
if (isset($_POST['dobavity']))
{
if (empty($_POST['zagolovok']))
{
exit ("<br><span class = 'ohibka'>Введите заголовок объявления!</span>");
}
if (empty($_POST['text_obyavl']))
{
echo "<Script Language='JavaScript'>alert('Введите текст объявления!');</Script>";
exit ("<br><span class = 'ohibka'>Введите текст объявления!</span>");
}
else
{
if (strlen($_POST['text_obyavl']) > 3000)
{
echo "<Script Language='JavaScript'>alert('Слишком большой текст объявления!');</Script>";
exit ("<br><span class = 'ohibka'>Максимальное количество символов в тексте объявления - 3000 знаков!</span>");
}
if (!empty ($_FILES["foto1"]['name']))
{
// Проверка размера файла
if ($_FILES['foto1']['size'] > 10000000) {exit ("<br><span class = 'ohibka'>Размер изображения №1 более 10 Мб.!</span>");}
// Проверяем тип файла
if(!preg_match('/[.](JPG)|(jpg)|(gif)|(GIF)|(png)|(PNG)$/',$_FILES['foto1']['name']))//проверка формата исходного изображения
{
exit ("<br><span class = 'ohibka'>Не верный тип изображения №1!</span>");
}
// сюда поставил код графической загрузки
if (ob_get_level() == 0) {
ob_start();
}
//echo str_pad('Loading... ',4096)."<br />\n";
$d = 0;
//$m = 0;
for($i = 0; $i < 25; $i++) {
$d += 11;
//$m += 10;
echo '<div class="percents">' . $i*4 . '% complete</div>';
echo '<div class="blocks" style="left: '.$d.'px"> </div>';
flush();
ob_flush();
sleep(1);
}
ob_end_flush();
// сюда поставил код графической загрузки
|
Далее идет обработка фото (если есть) скрипт приведён в предыдущих диалогах
Затем заносятся в переменные все поля формы
$zagolovok = $_POST['zagolovok']; $zagolovok = trim($zagolovok);
$zagolovok = htmlspecialchars($zagolovok); $zagolovok = stripslashes($zagolovok);
$text_obyavl = $_POST['text_obyavl']; $text_obyavl = trim($text_obyavl); $text_obyavl = stripslashes($text_obyavl);
$text_obyavl = htmlspecialchars($text_obyavl); $text_obyavl = nl2br($text_obyavl);
/*Функция "nl2br" устанавливает тег "<br>" в PHP форме, где есть перенос строки */
|
и загружаются в базу данных.
После загрузки происходит переадресация на информационную страницу об успешной публикации:
exit("<html><head><meta http-equiv='Refresh' content='0; URL=ok_obyavl.php?info=1&id=$id'></head></html>");
//content= 0 - время задержки перехода на страницу, в секундах
|
| |
| |
|
|
| |
|
|
| |
для: sega_z
(27.10.2011 в 09:55)
| | | Ну вы же обещали помочь ...?
При данной установке кода ни какая графическая загрузка не отображается!!!!
Да и вообще он сильно тормозит страницу!!! | |
| |
|
|
| |
|
|
| |
для: sega_z
(27.10.2011 в 15:36)
| | | не работает ((( ....
sleep() будет мешать работе всего скрипта, да и вообще, пока не выполнится полностью цикл...
во, тут надо почитать талмуд... )))
возможно проще будет сделать всё при помощи jquery, пользуюсь таким вариантом и пока всё устраивает... для этой цели можно практически любую gif картинку взять, на любой вкус ))) | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(27.10.2011 в 17:44)
| | | Спасибо, за ссылку. Замечательный генератор.
А можете дать сам скрипт вывода данной крутилки? | |
| |
|
|
| |
 1.2 Мб |
|
| |
для: sega_z
(27.10.2011 в 19:10)
| | | получайте пример обработки формы с gif подгрузчиком.
читайте комментарии, если всё сделаете правильно, то всё будет работать )))
распакуйте архив, сложите все файлы и директорию на одном уровне и пробуйте | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(27.10.2011 в 19:53)
| | | А можно просто подключив файл "jquery-1.5.min.js" поставить скрипт:
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
var background = $('<div><\/div>').css({'backgroundColor' : '#000',
'width' : '100%',
'height' : '100%',
'position' : 'fixed',
'z-index' : '1',
'top' : '0',
'left' : '0',
'opacity' : '0.2'});
var loading = $('<div><\/div>').css({'z-index' : '100',
'position' : 'fixed',
'top' : '50%',
'left' : '50%',
'margin' : '-64px 0 0 -64px'})
.html('<img src=\"load/loader-form4.gif\" alt=\"\" />');
$('#submit').click(function(){
$('body').prepend(loading);
$('body').prepend(background);
});
});
//]]>
</script>
|
после выполнения проверки форм и до обработки фото и загрузки файлов на сервер? | |
| |
|
|
| |
|
|
| |
для: sega_z
(27.10.2011 в 23:35)
| | | всё теперь в Ваших руках, можете экспериментировать с кодом как захотите, я не буду заявлять авторские права )))))))))
пробуйте, меняйте.... если не будет работать, пробуйте снова, пока не начнёт работать.
сейчас же всё работает?
оставьте только файл "jquery-1.5.min.js" там где он есть, без него не будет работать .
Вот только я не понял, почему Вас не устраивает нынешнее расположение кода в файле?
Да, кстати, можете поменять картинку подгрузчика, в директории "load" есть несколько вариантов... | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(27.10.2011 в 23:46)
| | | Там написано: "строковые данные надо обрабатывать функцией mysql_real_escape_string(), а числовые intval() например : $query = "INSERT INTO `table_name` (`first`, `second`) VALUES('".mysql_real_escape_string($first)."', '".mysql_real_escape_string($second)."')""
у меня просто: $result3 = mysql_query ("INSERT INTO doska (date_ok,date_podachi,date_end,...) VALUES('$date_ok','$date_podachi','$date_end',...)");
Есть разница?
Анимация будет показываться пока весь код на странице не закончит работу (что именно её останавливает)?
В браузере "Opera" экран затемняет, а картинка не выводится!!! Как исправить? | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 00:47)
| | | >Есть разница?
А Вы разве не увидели? разница не только в обработке функцией, но и в том, что имена таблицы и полей в ней заключены в "обратные кавычки" `table_name`.
Что бы картинка появлялась в Opera попробуйте следующее :
перед объявлением переменной "loading" создайте переменную "image"
<script type="text/javascript">
/* предыдущий код */
.......................................................................
var image = $('<img>').attr('src', './load/loader-form4.gif').css({'width':'130px', 'height':'130px'})
/* в переменной "loading" тоже внесите изменения */
var loadign = $("<div></div>")./* тут всё остальное */.html(image);
</script>
|
должно помочь в Opera | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 02:06)
| | | По поводу Оперы:
Исправил как вы сказали:
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
var background = $('<div><\/div>').css({'backgroundColor' : '#000',
'width' : '100%',
'height' : '100%',
'position' : 'fixed',
'z-index' : '1',
'top' : '0',
'left' : '0',
'opacity' : '0.2'});
var image = $('<img>').attr('src', './load/loader-form4.gif').css({'width':'130px', 'height':'130px'});
var loadign = $('<div></div>').css({'z-index' : '100',
'position' : 'fixed',
'top' : '50%',
'left' : '50%',
'margin' : '-64px 0 0 -64px'})
.html(image);
$('#submit').click(function(){
$('body').prepend(loading);
$('body').prepend(background);
});
});
//]]>
</script>
|
Но теперь экран не темнеет и картинка не отображается не только в Опере но и в других браузерах.
В чём ошибка?
А как добавить текст внизу картинки: "Ждите, происходит обработка информации..." ? | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 11:32)
| | | >Но теперь экран не темнеет и картинка не отображается не только в Опере но и в других браузерах.
Не знаю, почему у Вас не работает. У себя проверил в четырёх браузерах, Opera, Mozilla, Google Chrome и торознутый IE(6,7,8 версии) всё работает... вот только в IE 6 версии криво, но это и не главное.
>А как добавить текст внизу картинки: "Ждите, происходит обработка информации..." ?
Как вариант обернуть картинку в блоковый элемент, <div> и прописать в нём текст. попробуйте сначала сделать это отдельно от всего кода, а потом перенесите в код... об этом почитайте в руководстве по jquery. можно создать этот же <div> с текстом , а потом вставить туда картинку. | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 12:00)
| | | Вы у себя проверяли именно этот код:
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
var background = $('<div><\/div>').css({'backgroundColor' : '#000',
'width' : '100%',
'height' : '100%',
'position' : 'fixed',
'z-index' : '1',
'top' : '0',
'left' : '0',
'opacity' : '0.2'});
var image = $('<img>').attr('src', './load/loader-form4.gif').css({'width':'130px', 'height':'130px'});
var loadign = $('<div></div>').css({'z-index' : '100',
'position' : 'fixed',
'top' : '50%',
'left' : '50%',
'margin' : '-64px 0 0 -64px'})
.html(image);
$('#submit').click(function(){
$('body').prepend(loading);
$('body').prepend(background);
});
});
//]]>
</script>
|
| |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 12:27)
| | | ну а Вы как думаете ? )))))))))))))))))))))
проверьте, нет ли ошибок в коде, Вы же писали, что работал у Вас, кроме как в Opera
или прикрепите совой вариант, надо посмотреть | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 12:36)
| | | Никак не могу сделать, помогите добавить в переменную: var image = $('<img>').attr('src', './load/loader-form5.gif'); тег рисунка: alt="Обработка информации"
В коде написано "после формы не долно быть ни какого кода" - а у меня там закрывающие теги </table> и теги нижней шапки сайта, картинки, JS всплывающей подсказки (который должен стоять перед </body> и пр.)
Или это не имеет значение? | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 13:01)
| | | я имел ввиду, что ни какого кода относящегося к форме, её проверка и обработка, всё перед формой, или в подключаемом файле, то сам файл подключить перед формой....
>Никак не могу сделать, помогите добавить в переменную: var image = $('<img>').attr('src', './load/loader-form5.gif'); тег рисунка: alt="Обработка информации"
Это Вы не тег пытаетесь добавить, а атрибут тега img - alt...
как его добавить, попробуйте на примере установки стилей для картинки, посмотрите и сделайте аналогично.
добавлением атрибутов в jquery занимается attr() | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 14:56)
| | | Да, спасибо сделал так:
var image = $('<img>').attr('src', './load/loader-form5.gif').attr('alt', 'Подождите ...')
.css({'font-family': 'Verdana, Arial, Helvetica, sans-serif', 'font-weight': 'bold', 'font-size': '16px', 'color': '#000099'});
|
А обязательно обрабатывать строковые данные функцией mysql_real_escape_string(), а числовые intval() ? Или это как то влияет на работу всего скрипта?
У меня на странице по мимо этого куча JS подключенных к форме. Как вы считаете это не помешает работе данного скрипта? | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 15:21)
| | | >Да, спасибо сделал так:
Не правильно сделали.... посмотрите в документации к jquery как правильно будет...
можно ещё один атрибут добавть, при наведении на картинку курсора будет появляться подсказка...
>А обязательно обрабатывать строковые данные функцией mysql_real_escape_string(), а числовые intval() ? Или это как то влияет на работу всего скрипта?
смотря когда и куда.... поищите информацию по безопасности php приложений, sql-инъекций, xss... там всё будет расписано, когда и какие данные обрабатывать | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 15:38)
| | | Да, действительно нужная вещь!!!! Спасибо!
Я переделал код, но почему не во всех браузерах видно текст alt ?
var img = $('<img>');
var imageOnSrc = img.attr('src', './load1/loader-form5.gif');
var image = imageOnSrc.attr('alt', ' Подождите ... ').css({'font-family': 'Verdana, Arial, Helvetica, sans-serif', 'font-weight': 'bold', 'font-size': '18px', 'color': '#000099'});
|
| |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 16:52)
| | | [поправлено модератором] | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 17:17)
| | | Попытался вставить текст под картинку, но что то не получилось (текст отображает, но вместо картинки [object Object]):
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
var background = $('<div><\/div>').css({'backgroundColor' : '#000',
'width' : '100%',
'height' : '100%',
'position' : 'fixed',
'z-index' : '1',
'top' : '0',
'left' : '0',
'opacity' : '0.2'});
var image = $('<img>').attr({'src': './load/5(2).gif', 'alt': 'Подождите ...'})
.css({'font-family': 'Verdana, Arial, Helvetica, sans-serif', 'font-weight': 'bold', 'font-size': '16px', 'color': '#000099'});
var textBlock = '<br/>Подождите, происходит обработка информации ...';
var loading = $('<div><\/div>').css({'z-index' : '100',
'position' : 'fixed',
'top' : '50%',
'left' : '50%',
'margin' : '-64px 0 0 -64px'})
.html(image+textBlock);
$('#submit').click(function(){
$('body').prepend(loading);
$('body').prepend(background);
});
});
//]]>
</script>
|
Помогите пожалуйста найти и исправить ошибку. | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 18:18)
| | |
$('#submit').click(function(){
loading.append(textBlock);
$('body').prepend(loading);
$('body').prepend(background);
|
только я не понимаю зачем?
Экран затеняется, gif анимация появляется.... так Вам ещё надо и надпись вывести, что идёт обработка данных...
предлагаю ещё отправлять на email письмо с уведомлением + sms на телефон + срочная телеграмма... а вдруг до пользователя не дойдёт, что обрабатываются данные ))))
как говорится, слишком хорошо, тоже не хорошо...
но а если уж так хочется, то просто добавьте атрибут title со значением "Подождите, происходит обработка информации ...", после этого при наведении на картинку курсора будет появляться соответствующая надпись. | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 18:59)
| | | Внедрил данный код в свою страницу и как ожидалось встретил не стыковки:
1) У меня на странице поля проверяются функцией "required" (чтобы проверять заполнение полей на уровне браузера):
<input name="zagolovok" type="text" class="pole" value="<?php echo @$_POST['zagolovok'] ?>" size="93" maxlength="60"
tooltipText="Содержимое заголовка и текста объявления используется в быстром поиске по сайту, поэтому указывайте максимум необходимых слов." required>
|
Мозила просит заполнить поля и выделяет их красной рамкой, а экран темный и рисунок отображается - ничего сделать не возможно.
Я думаю что из-за нее не останавливается вышеуказанный скрипт "крутилки" - подскажите как это можно исправить???
С вашей помощью я думаю мы доведем дело до конца, немного осталось!
И вообще я благодарен вам, на вашем единственном форуме ВСЕГДА МОЖНО РЕШИТЬ ЛЮБОЙ ВОПРОС! Не даром этот форум самый лучший в инете о WEB программировании. | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 22:25)
| | | а вот теперь скажите, каким браузером Вы пользуетесь, то есть в каком проверяете и дайте ссылку на страницу
>Я думаю что из-за нее не останавливается вышеуказанный скрипт "крутилки" - подскажите как это можно исправить???
Не использовать пока html 5, не все барузеры его нормально поддерживают, IE, к примеру, вообще ни какая версия не поддерживает, Safari тоже ... Opera наполовину...
Так что выбирайте ...
Да и проверять форму на стороне клиента не совсем правильно, это легко подделать из исходного кода страницы. Это только для удобства пользователя и не более того
Если уж делать проверку, то на стороне сервера | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 22:43)
| | | Испытуемая страница заготовка: http://www.pc01.ru/4.php (проверьте в Firefox, Google Chrome)
Ничего не заполняя нажмите "Разместить объявление"
Что касается проверки, то она у меня выполняется как на стороне браузера так и на стороне сервера.
Просто пути к картинкам в полях
<input name="foto1" type="file" class="pole" size="80" maxlength="80">
|
сбрасываются при перезагрузке страницы (кстати может подскажите как этого избежать). А при проверке на стороне браузера путь к фото не сбрасывается, вот поэтому я использую "required". | |
| |
|
|
| |
|
|
| |
для: sega_z
(28.10.2011 в 23:17)
| | | А как же остальные браузеры, IE, Opera и Safari ?
И зачем проверять мне, если есть такой ресурс как validator.w3.org
вот при помощи этого ресурса и проверяйте свой сайт....
и сразу же увидите несоответствие, в DOCTYPE Вы указали , что используете документ HTML 4.01 и при этом пытаетесь использовать HTML 5
Вы определитесь, какую версию HTML Вы будете использовать... | |
| |
|
|
| |
|
|
| |
для: Slo_Nik
(28.10.2011 в 23:52)
| | | Хорошо убедили. Но как же быть с путями картинок в поле "files", чтобы они не сбрасывались при перезагрузке страницы???
Огромная просьба: удалите пожалуйста текст со ссылкой на мой сайт. | |
| |
|
|
|
