X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Вопрос по JS и jQuery - теория и практика
ShowPrint
ShowPrint
Topic Starter сообщение 13.3.2017, 19:30; Ответить: ShowPrint
Сообщение #1


Господа Гуру, помогите советом ламеру =)

Давно уж созрел один вопрос, состоящий из двух частей - теоретической и практической. Очень надеюсь получить ответы...

Теоретическая часть: насколько я понимаю, jQuery написана на JavaScript? или не так? Если так, то jQ должна по идее спокойно и корректно работать с "вкраплениями" javascript... Нэ?
Теоретический вопрос - так, больше для себя, для самообразования, а вытекает он из практической части...

Практическая часть:
Предыстория.
Когда-то очень давно, больше 10 лет назад, начал осваивать "на коленках" (по бумажным книжкам) javascript. В результате освоения появились у меня на сайте автоматизированныерасчеты, избавляющие пользователя от путаницы с безумными арифметическими действами со строками и колонками таблиц, попросту говоря "калькуляторы".
С момента создания и по сей день "калькуляторы" надежно и исправно работают, полюбились клиентам и высвободили массу времени на пустую переписку с расчетом заказов.

The problem is...
В прошлом году я мал-мала познакомился и перешел на jQ, с его помощью в какой-то момент решил улучшить юзабилити и реализовать по запросу посетителя отправку результатов расчета на указанную почту.
Посидел пару-тройку ночей и сделал. Тоже всё работает, но как-то избирательно - и это меня уже гложет достаточное количество времени.

Сам "калькулятор я не трогал, оставив его на JS, а отправку результатов сделал на jQuery, через ajax.

Выжимкки кода ниже, структура работы "калькуляторов" и процессы следующие:
1. Исходные данные указываются через поля формы.
2. Кнопка submit в форме отсутствует - на все input-ы навешены onChange, запускающие функцию расчета.
3. Результат расчета выдается посетителю посредством замены содержимого <span id="Total">...</span> и <span id="OnePcs">...</span> (общая сумма заказа и стоимость одного изделия соответственно)
здесь работает всё чётко
 
Для реализации отправки результатов на мыло:
1. Добавлена кнопка отправки по клику на которую в попап-окне посетитель указывает свой мэйл-адрес
2. Производится валидация адреса, если она успешная, то производится передача ajax-ом данных формы скрипту который производит формирование и отправку письма с расчетом на мыло посетителя.
3. Для того чтоб отправить результаты расчета в форму добавлены "скрытые" input-ы, которым калькулятором присваиваются результаты расчета при каждом обращении (изменении данных) к функции расчета

Выжимки из кода (чтоб не делать лишних простыней всё ненужное /*работающее*/ выброшено, оставлено только существенное):
HTML:

<form id='counting' name='counting' action='#' method='post'>

<!-- добавленные для отправки данных по e-mail input-ы -->
<input id='Total' name='Total' type='hidden'>
<input id='OnePcs' name='OnePcs' type='hidden'>
<input id='MailToSend' name='MailToSend' type='hidden'>

<!-- поля ввода данных для расчета -->
<p>Тираж: <input size='6' type='text' value='1' id='Quantity' name='Quantity' onKeyUp='CheckCorrectQuantity()'>&nbsp;шт.</p>
<p>Вид и производитель изделий:<br>
<select id='TShirts' onChange='ReCount()'>
<!-- Ряд <option> со своими значениями -->
</select>
</p>
<p>Индивидуальная упаковка:&nbsp;<input type='CheckBox' Checked id='IsPacked' name='IsPacked' onClick='ReCount()'></p>
<!-- Другие аналогичные input-ы и select-ы -->

<!-- Вывод результатов расчета -->
<p>Стоимость печати тиража:&nbsp;<span id='TotalRub'></span>&nbsp;руб.***</p>
<p>Цена одного изделия:&nbsp;<span id='OnePcsRub'></span>&nbsp;руб.*</p>

</form> <!-- Конец формы -->

JavaScript расчетной части:

// функция проверки корректности тиража
function CheckCorrectQuantity() {
// бла-бла-бла
if(lCorrect){ReCount();}
}

// сам калькулятор
function ReCount() {
var ... // загоняем значения полей в переменные и другие данные для расчета

////////////////////////
// сам скрипт расчета //
////////////////////////

nTotalSum=... // итоговая сумма
nOneCost=nTotalSum/Quantity.value; // стоимость единицы
// выводим пользователю результаты расчета
document.all("TotalRub").innerHTML=nTotalSum;
document.all("OnePcsRub").innerHTML=nOneCost;

//Задаем невидимые переменные для отправки результатов расчета
Total.value=nTotalSum;
OnePcs.value=StringRoundnOneCost;
}

Кусок jQuery-кода модального окна и отправки данных обработчику:

// some code

// вывод модального окна для задания адреса мыла через плагин FancyBox
$('.modalSend').fancybox({title:''});
$('#senddata').submit(function(){return false;});
$('#countsend').on('click',function(){
var sendemailval=$('#sendemail').val();
var sendmailvalid=validateEmail(sendemailval); // ранее описанная функция проверки валидности введенного мыла
if(sendmailvalid==false){$('#sendemail').addClass('error');}else if(sendmailvalid==true){$('#sendemail').removeClass('error');}
if(sendmailvalid==true){
$('#MailToSend').val(sendemailval); // ВАЖНО!!! Заносим e-mail в скрытый input формы с данными
$('#countsend').text('...отправка...').toggleClass('pButton'); // манипуляции с кнопкой модального окна
$.ajax({ // отправляем данные формы скрипту-обработчику, который высылает письмо по указанному адресу
type:'POST',
url:'/include/ajax/get_count.php',
data:$('#counting').serialize(),
success:function(data){
if(data=='true'){ // при успешной отправке письма сообщаем посетителю и закрываем модальное окно
$('#sendme').fadeOut('fast',function(){
$(this).before('<p>Расчет отправлен по указанному адресу электронной почты</p>');
$('#countsend').text('Отправить расчет');
$('#countsend').toggleClass('pButton');
setTimeout('$.fancybox.close()',2000);
});
}
}
});
}
});

// some code

Скрипт обработчик полученных данных из формы не привожу (не мусорить моск), отлажен, работает чётко...

А вот теперь суть проблемы!!!
Всё гладко, отлажено, проверено, но срабатывает не всегда!!!
Точнее всегда срабатывает, но иногда - частично!!!  :huh:

В некоторых случаях в письмах отправляемых посетителю с расчетами отсутствуют как раз самые важные переменные - стоимости (Total и OnePcs). Все другие заполненные параметры - отправляются (они прописываются в письме).
Знаю об этом, потому что скрипт параллельно с отправкой письма пользователю еще присылает и мне копию произведенного расчета  :unsure:
Сначала думал что проблема в присвоении скрытых переменных на JS - посмотрел через инструменты веб-разработчика: нет, всё чётко - скрытым полям значения присваиваются.
Было подозрение что скрытые поля не передаются ajax-ом скритпу-обработчику: тоже не так - люди-то письма получают (только без стоимости), а е-мэйл-адрес обработчик получает из такого же скрытого input-а  :wacko:

Понимая что разница в том, что значение input-у присваивается разными вариантами (стоимость-js, мыло-jQ) у меня закралась мысль что может у посетителя отключен js... В этой связи и возникла "теоретическая" часть вопроса... Ведь если jQuery работает только "в связке" с JS, то тогда и сам сервис отправки почты не должен работать... Весь моск себе сломал... :angry:

А самое парадоксальное (барабанная дробь!!!) что когда я получаю дубль такого письма посетителю (в котором отсутствуют цены), по своей копии письма, я прямо на сайте указываю все данные заполненные пользователем, получаю расчет, нажимаю "отправить на почту", указываю мыло пользователя, тискаю "отправить" и... Посетителю (и мне копия) прилетает письмо правильного содержания, включая цифры стоимости!!! ЧТО ЭТО??? И как это может быть???

Вот такое вот "кино, вино и домино"... У кого-нибудь есть на этот счет мысли или предположения? Поделитесь, плиззззз...  :rolleyes:
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
Topic Starter сообщение 13.3.2017, 19:48; Ответить: ShowPrint
Сообщение #2


(ShowPrint @ 13.3.2017, 22:30) *
у меня закралась мысль что может у посетителя отключен js
Отследил через Вебвизор одно такое сегодняшнее посещение - у посетителя присутствует JS: видно что калькулятор считает, а он на 100% javascript-е...  :wacko:
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ixman
ixman
сообщение 13.3.2017, 20:26; Ответить: ixman
Сообщение #3


ShowPrint, jQuery по сути это и есть javascript, только он заточен для более удобной работы. То есть цепляешь библиотеку jQuery и лишней писанины на js нет. Так-то это плохо, но как любой фреймворк даёт кучу свободного времени. Работают вместе с чистым js на ура, никаких проблем не замечал.

Если в браузере отключен js, то и jQuery тут не поможет. Всего скорее где-то, при каких-то условиях происходит сбой. Виной этому может быть старый браузер или ещё какие-либо варианты.

Я бы порекомендовал пройтись каким-нибудь заумным валидатором js проверить твой код, нет ли каких-то спорных функций или способов написания кода. Также отследить с каких браузеров приходят полупустые письма.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
Topic Starter сообщение 13.3.2017, 21:14; Ответить: ShowPrint
Сообщение #4


( @ 13.3.2017, 23:26) *
То есть цепляешь библиотеку jQuery и лишней писанины на js нет. Так-то это плохо, но как любой фреймворк даёт кучу свободного времени. Работают вместе с чистым js на ура, никаких проблем не замечал.

Не вдаваясь в глубинные познания я именно так и думал... Открывал код jQ в текстовом редакторе и решил что он сам написан на JS... =)

( @ 13.3.2017, 23:26) *
при каких-то условиях происходит сбой

Вот и ломаю голову - где он может быть... )))

Не-заумный валидатор сообщил что всё хорошо и код рабочий.
Прикрепленное изображение

Заумный валидатор выдал "простыню" с двумя вариантами ошибок в большом числе:
а) использование == вместо === и != вместо !==
б) использование не описанных переменных (типа Quantity.value - пишет: Quantity - не определено)

( @ 13.3.2017, 23:26) *
отследить с каких браузеров приходят полупустые письма

Ну они не то чтоб полупустые - с отсутствием двух, но самых важных полей )))

Сегодняшний заход вычислил: 11-осёл на 7-й винде
Более ранние случаи сейчас не представляется возможности отследить - не так часто пользователи юзают этот сервис, не вычислить. Будут еще - посмотрю...

Пока (для наблюдашек) в одном из калькуляторов сделал присвоение значения "попадающим" скрытым input-ам через jQ - буду наблюдать... Сейчас еще поправлю код относительно === и !== 

Была грешная мысль переписать калькуляторы с JS на jQ, но как-то думал что
( @ 13.3.2017, 23:26) *
Так-то это плохо

и раз уж написан и отлажен на JS, то это больше по феншую...

PS. Спасибо за участие!
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ixman
ixman
сообщение 13.3.2017, 21:50; Ответить: ixman
Сообщение #5


Всего скорее беда с браузерами линейки IE. Я недавно сам бился с этими ослами. Они как-то по своему интерпретируют js код, точнее некоторый стиль написания и некоторые функции попросту не поддерживают. В том числе и 11 осёл. А вот EDGE в 10 окне уже норм обрабатывает. И ни один справочник, из тех что я смотрел, не указал мне, что могут быть проблемы. У них на примерах так и было, как я делал, а осел упрямился коротенькому коду. В общем пришлось сделать код длиннее, по ослиному феншую, чтобы не упрямился. В общем ужасный оконный арбузер 14.gif
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
Topic Starter сообщение 13.3.2017, 21:52; Ответить: ShowPrint
Сообщение #6


Ixman, спасибо за эзотерический пинок:
(Ixman @ 13.3.2017, 23:26) *
отследить с каких браузеров приходят полупустые письма
Оказалось что у меня тоже стоит вин7 с 11-м ослом - и у меня не работает )))))

Ваще скрипт не работает: по ходу он не понимает что Quantity.value относится к <input id="Quantity">, матерится что 
"Quantity" не определено

и походу вообще прерывает выполнение скрипта...

И это не смотря на то, что у меня все скрипты обёрнуты в

$(document).ready(function(){

// скрипты

}

То есть по идее весь DOM должен быть полностью сформирован и только после этого должны грузиться скрипты, соответственно

<input size='6' type='text' value='1' id='Quantity' name='Quantity' onKeyUp='CheckCorrectQuantity()'>

должен быть схаван на 100%

Вот же он ОСЁЛ!!! =)

Понятно что есть с чем разбираться... Будем мочить ослов!!!  :lol:
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ixman
ixman
сообщение 13.3.2017, 21:55; Ответить: ixman
Сообщение #7


ShowPrint, думаю уже дальше решишь проблему, как и я. Нужно всего лишь код подстроить под IE
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
Topic Starter сообщение 13.3.2017, 22:23; Ответить: ShowPrint
Сообщение #8


(Ixman @ 14.3.2017, 00:55) *
Нужно всего лишь код подстроить под IE

Надеюсь - главное понятно где проблема, а решение найти всегда можно =)

Первое что приходит в голову - переписать калькуляторы на jQ, так как я не понимаю как можно по другому бороться с ослом, который не понимает кода "идентификатор.value"

Нашел еще вариант решения: попробовал в заумном валидаторе поменять

Quantity.value 

на

document.getElementById('Quantity').value

Ошибка пропадает... И ослу этот вариант по ходу подходит...

Долбанный осёл!!! Обеспечил мне веселую ночьку... Переправить все калькуляторы и еще проверить все остальные JS - до утра работы хватит...

Нет худа без добра - зато знаю теперь что JS-код нудно проверять не только на работоспособность, но и на валидность  :D

UPD:
Кстати, нашел еще заумный (правильный) валидатор JS - он еще много что делает, и не только с JS, еще и жмет css, js и т.д. и ещё много всякой полезности. С остальным пока не разбирался, не до того, на досуге посмотрю...
[mwhide=0]Вдруг кому пригодится: http://beautifytools.com/javascript-validator.php При клике на лого открывается перечень всех полезных сервисов[/mwhide]

Сообщение отредактировал ShowPrint - 13.3.2017, 22:32
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
Topic Starter сообщение 14.3.2017, 13:46; Ответить: ShowPrint
Сообщение #9


Ixman, я ночером один из калькуляторов сделал через относительно валидный JS и осёл его скушал, но он же не просто так "осёл" - инструмент разработчика всё-равно нашел одну синтаксическую ошибку (какую именно не нашел вариантов посмотреть), хорошо хоть она не мешает ему корректно работать.

Сегодня закину на сервис и начну пристальное наблюдение  :unsure:
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ixman
ixman
сообщение 14.3.2017, 18:58; Ответить: ixman
Сообщение #10


ShowPrint, если на осле сработало, то работать будет везде.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Услуги по созданию и доработке скриптов PHP, MySQL, JavaScript, jQuery
Разработка сайтов и сервисов под-ключ
0 alexey 1168 24.11.2023, 14:46
автор: alexey
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыВеб-разработка (HTML5, CSS3, JavaScript, jQuery, Ajax, PHP)
56 qpPeW 44760 19.7.2023, 10:03
автор: qpPeW
Открытая тема (нет новых ответов) Вопрос - платное размещение баннеров на сайте
10 WGN 3125 14.12.2020, 14:20
автор: Peterson
Открытая тема (нет новых ответов) Вопрос по рекламе в "инстаграме"
Только активные аккаунты могут создавать или редактировать рекламу
8 Zubkov 16020 17.1.2020, 17:49
автор: Forumacc
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыВопрос-ответ о работе форума
307 dos1k 43056 9.11.2019, 17:59
автор: heks


 



RSS Текстовая версия Сейчас: 28.3.2024, 17:24
Дизайн