Извините, ничего не найдено.

Не расстраивайся! Лучше выпей чайку!
Регистрация
Справка
Календарь

Вернуться   forum.boolean.name > Веб-программирование > JavaScript / HTML

JavaScript / HTML Создание динамической разметки страниц

Ответ
 
Опции темы
Старый 12.10.2015, 17:11   #1
tirarex
Бывалый
 
Аватар для tirarex
 
Регистрация: 23.11.2011
Сообщений: 863
Написано 334 полезных сообщений
(для 866 пользователей)
Послать запрос без перезагрузки страницы.

Есть у меня модуль esp8266 , юзаю его для вкл/выкл вентиляторов на батареи и светодиодной ленты.
Сервер не имеет своей памяти в обычном понимании , код страницы должен быть прописан в прошивку и залит на модуль. Единым файлом , без css , js ,jquery и картинок. (памяти очень мало)

Кнопки сейчас сделаны так
<center><a href='/l1' class='btn'>1 светодиод</a></center>\ 
сама страницы (/l1) загружается и перенаправляет нас на основную страницу
<html>\
      <
meta http-equiv='refresh' content='1;URL=/' />\
 </
html>\ 
Но этот костыль перезагружает страницу , от чего мы видим белый экран пару секунд.
Хотелось бы как то исправить ситуацию. Но поскольку я плохо знаком с html , спрашиваю тут , как сделать запрос по кнопке без перенаправления и перезагрузки страницы.

Полный код страницы

snprintf temp1500,"
<html>\
  <head>\
    <meta charset='UTF-8' />\
    <title>Небольшая страница</title>\
 <style>\
  body \
  { \
      background-color: #474D4C;\
      Color: #979797;\
    }\
.btn {\
  border-radius: 5px;\
  font-family: Arial;\
  font-size: 45px;\
  color: #777777;\
  padding: 0px;\
  background: #ededed;\
  border: solid #dcdcdc 2px;\
  text-decoration: none;\
}\
.btn:hover {\
  background: #dfdfdf;\
}\
 </style>\
  </head>\
    <body>\
      <center><h1>Micro server.</h1></center>\
      <center><a href='/l1' class='btn'>1 светодиод</a></center>\
        <center><a href='/l2' class='btn'>2 светодиод</a></center>\
    </body>\
</html>"
); 


(Offline)
 
Ответить с цитированием
Старый 12.10.2015, 17:50   #2
dsd
Мастер
 
Аватар для dsd
 
Регистрация: 13.06.2011
Сообщений: 1,103
Написано 481 полезных сообщений
(для 1,836 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Сообщение от tirarex Посмотреть сообщение

Но этот костыль перезагружает страницу , от чего мы видим белый экран пару секунд.
Хотелось бы как то исправить ситуацию. Но поскольку я плохо знаком с html , спрашиваю тут , как сделать запрос по кнопке без перенаправления и перезагрузки страницы.
JavaScipt. jQuery, + Ajax- запросы.
jQuery ищет в тексте кнопку по ее ид. который в теге кнопки [button id=такой то ид]
$('#такой то ид').bind('click' , function () {

А тут текст функции какой привязывается к этой кнопке по нажатию мыши на эту кнопку. Внутри этой функции можно отправить Ajax запрос к какой угодно странице в интернете в том числе к пхп или не пхп скрипту включающему соответствующий диод на сервере

$.getJSON("php/JSON_maker.php", Json , function(data){
и тут действия в зависимости от того че там сервер выдаст на этот запрос
});
или $.post(); или еще чем из средств jQuery

});
(Offline)
 
Ответить с цитированием
Эти 2 пользователя(ей) сказали Спасибо dsd за это полезное сообщение:
ABTOMAT (13.10.2015), tirarex (13.10.2015)
Старый 13.10.2015, 03:02   #3
moka
.
 
Регистрация: 05.08.2006
Сообщений: 10,429
Написано 3,454 полезных сообщений
(для 6,863 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

jQuery заливать будешь текстом в html? У него железка и там мелкая, там html также нужно дерать как можно меньше. Желательно минифицировать как можно.

Используй Vanilla JS и ванильный AJAX: XMLHttpRequest

// find button
var button document.getElementById('button');

var 
onClick = function() {
    
// make AJAX request
    
var req = new XMLHttpRequest();
    
req.addEventListener('load', function() {
        
// console log response
        
console.log(req.response);
    });
    
req.open('GET''/url-here');
    
req.send();
}

// subscribe to button click
button.addEventListener('click'onClickfalse); 
Лучше сервить веб-панель вообще не с самого девайса.
Девайс пусть просто реализует API - пару web страниц для управления его состояние. А панель контроля реализована где-то на другом серерве. Все что нужно будет, это из панели вызвать нужный API путь на модуле.
Так оптимальнее, проще обновлять, и модуль может буквально "спать" пока на него не ссылаешься, что экономит энергию тоже.
(Offline)
 
Ответить с цитированием
Эти 3 пользователя(ей) сказали Спасибо moka за это полезное сообщение:
pax (13.10.2015), St_AnGer (13.10.2015), tirarex (13.10.2015)
Старый 13.10.2015, 04:25   #4
ABTOMAT
Ференька
 
Аватар для ABTOMAT
 
Регистрация: 26.01.2007
Адрес: улица Пушкина дом Колотушкина
Сообщений: 10,741
Написано 5,461 полезных сообщений
(для 15,675 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Мока, jQuery можно подключить с внешнего хоста
__________________
Мои проекты:
Анальное Рабство
Зелёный Слоник
Дмитрий Маслов*
Различие**
Клюква**

* — в стадии разработки
** — в стадии проектирования
Для проектов в стадии проектирования приведены кодовые имена

(Offline)
 
Ответить с цитированием
Сообщение было полезно следующим пользователям:
tirarex (13.10.2015)
Старый 13.10.2015, 10:46   #5
tirarex
Бывалый
 
Аватар для tirarex
 
Регистрация: 23.11.2011
Сообщений: 863
Написано 334 полезных сообщений
(для 866 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Сообщение от ABTOMAT Посмотреть сообщение
Мока, jQuery можно подключить с внешнего хоста
Устройство юзается как хотспот и не имеет доступ к внешним ресурсам , как дойдут руки , может малину сделаю основным сервером.

За ответы спасибо , проблема решена !
(Offline)
 
Ответить с цитированием
Старый 13.10.2015, 13:50   #6
moka
.
 
Регистрация: 05.08.2006
Сообщений: 10,429
Написано 3,454 полезных сообщений
(для 6,863 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Сообщение от ABTOMAT Посмотреть сообщение
Мока, jQuery можно подключить с внешнего хоста
Если девайс юзается как hotspot, то такой возможности не будет.
Если девайс в сети по IP'шнику, то такая возможность будет только если есть доступ к интернету.
В публичных WiFi точках, бывает делают разные системы, где доступ к интернету только после регистрации.
Также внешняя зависимость которая если не будет доступна, то твой девайс "не будет работать".
Зачем тянуть 80Kb+ когда тоже самое пишется практически в столько же строк? И речь идет о менее 100 строк кода. Таких jQuery операторов развелось, которые на JS даже писать не умеют. Ты же вроди тру-web-щик, подавай хороший пример подаванам.
(Offline)
 
Ответить с цитированием
Эти 2 пользователя(ей) сказали Спасибо moka за это полезное сообщение:
pax (13.10.2015), St_AnGer (17.10.2015)
Старый 14.10.2015, 00:11   #7
ABTOMAT
Ференька
 
Аватар для ABTOMAT
 
Регистрация: 26.01.2007
Адрес: улица Пушкина дом Колотушкина
Сообщений: 10,741
Написано 5,461 полезных сообщений
(для 15,675 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Сообщение от moka Посмотреть сообщение
Зачем тянуть 80Kb+ когда тоже самое пишется практически в столько же строк? И речь идет о менее 100 строк кода. Таких jQuery операторов развелось, которые на JS даже писать не умеют. Ты же вроди тру-web-щик, подавай хороший пример подаванам.
Но тогда жи ни будет работать в IE!!11 Пиши все костыли под каждую версию!111
Хотя да, эта проблема уже изжита (наверное)
__________________
Мои проекты:
Анальное Рабство
Зелёный Слоник
Дмитрий Маслов*
Различие**
Клюква**

* — в стадии разработки
** — в стадии проектирования
Для проектов в стадии проектирования приведены кодовые имена

(Offline)
 
Ответить с цитированием
Старый 14.10.2015, 00:47   #8
moka
.
 
Регистрация: 05.08.2006
Сообщений: 10,429
Написано 3,454 полезных сообщений
(для 6,863 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Изжита. А если и кто-то встретился с таким, то по лицу можно бить.

IE7+ поддерживает, так что не нужно париться. На древних IE7-8 проверка на принятое сообщение из 2 строк, меняется на 4.
(Offline)
 
Ответить с цитированием
Сообщение было полезно следующим пользователям:
Phantom (17.10.2015)
Старый 17.10.2015, 21:49   #9
Phantom
Элита
 
Аватар для Phantom
 
Регистрация: 14.06.2008
Адрес: Украина, Киев
Сообщений: 2,273
Написано 754 полезных сообщений
(для 1,833 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

tirarex, почём и где модули берёшь?
(Offline)
 
Ответить с цитированием
Старый 17.10.2015, 22:04   #10
Randomize
[object Object]
 
Аватар для Randomize
 
Регистрация: 01.08.2008
Адрес: В России
Сообщений: 4,354
Написано 2,470 полезных сообщений
(для 6,850 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Сообщение от ABTOMAT Посмотреть сообщение
Пиши все костыли под каждую версию!111
Изи
function xhr(){
    try {
        return new 
XMLHttpRequest();
    }catch(
e){}
    try {
        return new 
ActiveXObject("Msxml3.XMLHTTP");
    }catch(
e){}
    try {
        return new 
ActiveXObject("Msxml2.XMLHTTP.6.0");
    }catch(
e){}
    try {
        return new 
ActiveXObject("Msxml2.XMLHTTP.3.0");
    }catch(
e){}
    try {
        return new 
ActiveXObject("Msxml2.XMLHTTP");
    }catch(
e){}
    try {
        return new 
ActiveXObject("Microsoft.XMLHTTP");
    }catch(
e){}

    return 
null;

__________________
Retry, Abort, Ignore? █
Intel Core i7-9700 4.70 Ghz; 64Gb; Nvidia RTX 3070
AMD Ryzen 7 3800X 4.3Ghz; 64Gb; Nvidia 1070Ti
AMD Ryzen 7 1700X 3.4Ghz; 8Gb; AMD RX 570
AMD Athlon II 2.6Ghz; 8Gb; Nvidia GTX 750 Ti
(Online)
 
Ответить с цитированием
Старый 18.10.2015, 01:17   #11
tirarex
Бывалый
 
Аватар для tirarex
 
Регистрация: 23.11.2011
Сообщений: 863
Написано 334 полезных сообщений
(для 866 пользователей)
Ответ: Послать запрос без перезагрузки страницы.

Сообщение от Phantom Посмотреть сообщение
tirarex, почём и где модули берёшь?
Брал девбоард тут , за 220руб. http://ru.aliexpress.com/item/ESP826...242633472.html


Продавца не советую , но цена оправдывает.
Отправляет в лучшем случае через пару недель.
+ доставка 30 дней.

По плате - тоже не советую , 100руб переплаты за пару резисторов (необходимых для обвязки модуля) , остальное - бесполезные диоды.
Сам есп ловит не плохо , но есть версия с антенной (керамика + вч разьем).
Программатор на cp2102 - пошел без проблем , но на плате (с есп) спутаны местами txd и rxd.
С батарейками (3шт АА вроде) плата не завелась (3шт gp аккумы на 2500махов 1,2v) ,но с аккумом от нокии проблем нет.

В общем советую взять вот такой модуль (esp-07) http://ru.aliexpress.com/item/Free-s...382097249.html
Из плюсов - слот для антенны , и уже встроенная керамическая. И продавец проверенный , советую к нему заглянуть , смд рассыпуха за копейки.

И под нее платку для распайки , сразу с подтягивающими резисторами. http://ru.aliexpress.com/item/ESP826...381092806.html
(Offline)
 
Ответить с цитированием
Сообщение было полезно следующим пользователям:
Phantom (22.10.2015)
Ответ


Опции темы

Ваши права в разделе
Вы не можете создавать темы
Вы не можете отвечать на сообщения
Вы не можете прикреплять файлы
Вы не можете редактировать сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.


Часовой пояс GMT +4, время: 08:59.


vBulletin® Version 3.6.5.
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Перевод: zCarot
Style crйe par Allan - vBulletin-Ressources.com