У меня страничка сделана на основе кода Евгения, но общая схема немного другая. Страничка и файл с данными лежат на роутере с OpenWRT. Арудина принимает по радио данные от беспроводного сенсора на улице и отправляет их по сети на роутер. Там скриптом данные парсятся и ложаться в data.txt. В конечном счете получается вот так:
var o=new XMLHttpRequest();
function dR() {
//yarkost = document.getElementById("qp").value;
yarkost = document.getElementsByClassName("article").value;
yarkost1 = document.getElementById("wp").value;
o.open("GET","kaka.htm?r="+Math.random()+"q="+yarkost+"w="+yarkost1,1);
o.onload=function(){
var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g);
for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {};
setTimeout("dR()", 500);
}
o.send();
}
Не читает значение
И не должен. Метод getElementsByClassName, возвращает массив элементов с таким классом, а не отдельный элемент. Для проверки уберите в 5-ой строке .value, а после строки 5 поставьте alert(yarkost.length) - должен показать количество таких элементов в массие. Если у Вас элемент с таким классом 1, то и пожет 1. В этом случае Вы можете вместо
В том скрипте change было не ID, а имя события. Кроме того, какой там был элемент? Поди какой-нибудь INPUT? Ну, уж точно не DIV. с DIV такая штука сработает только в MSIE, а во всём остальном с геморроем.
Посмотрите, какой там в итоге элемент используется, тогда поговорим.
var on ='<img src="on.png">'
var off ='<img src="off.png">'
var q = document.getElementById("A0").innerHTML;
var a = document.getElementById("A1").innerHTML;
var z = document.getElementById("A2").innerHTML;
document.getElementById("kn1").innerHTML = q;
document.getElementById("kn2").innerHTML = a;
document.getElementById("kn3").innerHTML = z;
Подскажи пожалуйста, почему
document.getElementById("A01").innerHTML = on; работает
а
document.getElementById("A01").innerHTML = q; (где q считалось из файла и равно on) не работает
document.getElementById("A01").innerHTML = on; работает
а
document.getElementById("A01").innerHTML = q; (где q считалось из файла и равно on) не работает
Чёт я в коде такого не вижу.
В любом случае, поставьте там alert (а лучше печать в отладочный div или textarea) чтоюы посмотреть чему оно равно перед присваиванием. навернка многое прояснтся.
по поводу же что и как Вы ставите. Давайте Вы приведёте два кода, что я ьог их явно сравнить. И кроме того, не пренебрегайте отладочной печатью На Web странице печать делается легко, а она Вам поможет понимать что происходит. Нужен пример организации печати?
var q = document.getElementById("A0").innerHTML;
var a = document.getElementById("A1").innerHTML;
var z = document.getElementById("A2").innerHTML;
alert(q); //выводт off
document.getElementById('kn1').innerHTML = q ;
document.getElementById('kn2').innerHTML = a ;
document.getElementById('kn3').innerHTML = z ;
var q = document.getElementById("A0").innerHTML;
var a = document.getElementById("A1").innerHTML;
var z = document.getElementById("A2").innerHTML;
alert(q); //выводт off
// ну, а если тут пишешь
if( q == "off") q = '<img id="off" onclick="myFunction()" src="off.png">';
document.getElementById('kn1').innerHTML = q ; // тут картинка должна быть или с off приходит еще с какими то символами типа \r\n
document.getElementById('kn2').innerHTML = a ;
document.getElementById('kn3').innerHTML = z ;
И для отладки алерт (для меня) неудомен, лучше так:
var q = document.getElementById("A0").innerHTML;
var a = document.getElementById("A1").innerHTML;
var z = document.getElementById("A2").innerHTML;
console.log('Переменная q: '+q);
console.log('Переменная a: '+a);
console.log('Переменная z: '+z);
console.log('');
document.getElementById('kn1').innerHTML = q ;
document.getElementById('kn2').innerHTML = a ;
document.getElementById('kn3').innerHTML = z ;
ЕвгенийП, респект, простой двиг, и можно запихнуть в 328.
Вообще, мне больше нра jQuery, ну просто ей удобно пользоваться (вписываешь id/класс по правилам CSS и вперёд), но тащемта я её использую только для трёх вещей:
1. асинхронный обмен инфой, т. о. AJAX
2. чисто клиентские красивости, т. е. доступ к CSS свойствам и фишки типа fadeOut()
3. JSON, хотя это уже прихоть
Мб удастся понять, что в ней отвечает за css(), attr() и выдрать. К сожалению я сейчас по ноздри в одном проекте (первый на берегу Хэйлунцзян escape room), но потом можно заняться.
Евгений, отличную тему вы создали и толково все разъяснили. Взял на заметку. Спасибо.
#include <EtherCard.h> static byte mymac[] = { 0x74,0x69,0x69,0x2D,0x30,0x31 }; static byte myip[] = { 192,168,1,100 }; const char website[] PROGMEM = "192.168.1.100"; byte Ethernet::buffer[900]; BufferFiller bfill; void setup () { Serial.begin(250000); ether.begin(sizeof Ethernet::buffer, mymac, 10); ether.staticSetup(myip); pinMode(3, OUTPUT); } void loop () { word pos = ether.packetLoop(ether.packetReceive()); if (pos){ // получаем заголовки char *data = (char *) Ethernet::buffer + pos; Serial.print(data); // проверяем на наличие в заголовках нужных нам строк if (strstr(data, "GET /index.htm") || strstr(data, "GET / HTTP/1.1") ) { bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/html\r\n" "\r\n" "<html>" "<head>" "<meta charset=\"utf-8\">" "<title>Яркость</title>" "</head>" "<body onload=\"dR()\">" "<button onclick=\"yar()\">Установим яркость 10</button>" "<script>" //"function yar() {" "var xhr = new XMLHttpRequest();" "function dR() {" "var yarkost = Math.round(Math.random()*255);" "xhr.open('GET', 'kaka.htm?y='+yarkost, 1);" "setTimeout(\"dR()\", 1000);" "xhr.send();" "}" "</script>" "</body>" "</html>" )); } if (strstr(data, "GET /kaka.htm HTTP/1.1") ) { analogWrite(3, yarkost); bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/html\r\n" "\r\n" "yarkost" )); }*/ ether.httpServerReply(bfill.position()); } }Немного исправил, там ошибка была с запросом.
Как получить эту самую переменную yarkost
Евгений, отличную тему вы создали и толково все разъяснили. Взял на заметку. Спасибо.
Да, Евгений очень помогает, тема отличная.
Ну, во-первых, Вы ищете зачем-то больно много. Зачем Вы пишете
if(strstr(data,"GET /kaka.htm?y=10 HTTP/1.1") )Достаточно
А число, так ищите потом "?=" и берите число сразу после. Вот так
Всё. Число, которое идёт после ?= уже преобразовано в int и сидит в переменной value.
#include <EtherCard.h> static byte mymac[] = { 0x74,0x69,0x69,0x2D,0x30,0x31 }; static byte myip[] = { 192,168,1,100 }; const char website[] PROGMEM = "192.168.1.100"; byte Ethernet::buffer[900]; BufferFiller bfill; void setup () { Serial.begin(250000); ether.begin(sizeof Ethernet::buffer, mymac, 10); ether.staticSetup(myip); pinMode(3, OUTPUT); } void loop () { word pos = ether.packetLoop(ether.packetReceive()); if (pos){ // получаем заголовки char *data = (char *) Ethernet::buffer + pos; Serial.print(data); // проверяем на наличие в заголовках нужных нам строк if (strstr(data, "GET /index.htm") || strstr(data, "GET / HTTP/1.1") ) { bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/html\r\n" "\r\n" "<html>" "<head>" "<meta charset=\"utf-8\">" "<title>Яркость</title>" "</head>" "<body onload=\"dR()\">" "<button onclick=\"yar()\">Установим яркость 10</button>" "<script>" //"function yar() {" "var xhr = new XMLHttpRequest();" "function dR() {" "var yarkost = Math.round(Math.random()*255);" "xhr.open('GET', 'kaka.htm?='+yarkost, 1);" "setTimeout(\"dR()\", 1000);" "xhr.send();" "}" "</script>" "</body>" "</html>" )); } if (strstr(data, "GET /kaka.htm") ) { int yarkost = atoi(strstr(data, "?=") + 2); analogWrite(3, yarkost); bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/html\r\n" "\r\n" "случайное число" )); } ether.httpServerReply(bfill.position()); } }Всё работает
Теперь Вы знаете как делать связь с сервером. Удачи!
#include <EtherCard.h> static byte mymac[] = { 0x74,0x69,0x69,0x2D,0x30,0x31 }; static byte myip[] = { 192,168,1,100 }; const char website[] PROGMEM = "192.168.1.100"; byte Ethernet::buffer[900]; BufferFiller bfill; void setup () { Serial.begin(250000); ether.begin(sizeof Ethernet::buffer, mymac, 10); ether.staticSetup(myip); pinMode(3, OUTPUT); pinMode(6, OUTPUT); } void loop () { word pos = ether.packetLoop(ether.packetReceive()); if (pos){ // получаем заголовки char *data = (char *) Ethernet::buffer + pos; Serial.print(data); // проверяем на наличие в заголовках нужных нам строк if (strstr(data, "GET /index.htm") || strstr(data, "GET / HTTP/1.1") ) { bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/html\r\n" "\r\n" "<html>" "<head>" "<meta charset=\"utf-8\">" "<title>Яркость</title>" "<script src=\"/evgeniip.js\"></script>" "</head>" "<body onload=\"dR()\">" "Яркость первого светодиоода:<span id=\"q\"></span><br>" "Яркость второго светодиода:<span id=\"w\"></span>" /*"<script>" //"function yar() {" "var xhr = new XMLHttpRequest();" "function dR() {" "var yarkost = Math.round(Math.random()*255);" "var yarkost1 = Math.round(Math.random()*255);" "xhr.open('GET', 'kaka.htm?q='+yarkost+'w='+yarkost1, 1);" "setTimeout(\"dR()\", 1000);" "xhr.send();" "}" "</script>"*/ "</body>" "</html>" )); } if (strstr(data, "GET /kaka.htm") ) { int yarkost = atoi(strstr(data, "q=") + 2); int yarkost1 = atoi(strstr(data, "w=") + 2); analogWrite(3, yarkost); analogWrite(6, yarkost1); bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/plain\r\n" "\r\n" "q = $D\r\n" "w = $D\r\n" ),yarkost,yarkost1); } ether.httpServerReply(bfill.position()); } }evgeniip.js
var o=new XMLHttpRequest(); function dR() { var yarkost = Math.round(Math.random()*255); var yarkost1 = Math.round(Math.random()*255); o.open("GET","kaka.htm?r="+Math.random()+"q="+yarkost+"w="+yarkost1,1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 1000); } o.send(); }Какие есть замечания?
У меня страничка сделана на основе кода Евгения, но общая схема немного другая. Страничка и файл с данными лежат на роутере с OpenWRT. Арудина принимает по радио данные от беспроводного сенсора на улице и отправляет их по сети на роутер. Там скриптом данные парсятся и ложаться в data.txt. В конечном счете получается вот так:
Приветствую.
Евгений, подскажи пожалуйста
На страничке есть
В скрипте
var o=new XMLHttpRequest(); function dR() { //yarkost = document.getElementById("qp").value; yarkost = document.getElementsByClassName("article").value; yarkost1 = document.getElementById("wp").value; o.open("GET","kaka.htm?r="+Math.random()+"q="+yarkost+"w="+yarkost1,1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 500); } o.send(); }Не читает значение
На страничке есть
В скрипте
var o=new XMLHttpRequest(); function dR() { //yarkost = document.getElementById("qp").value; yarkost = document.getElementsByClassName("article").value; yarkost1 = document.getElementById("wp").value; o.open("GET","kaka.htm?r="+Math.random()+"q="+yarkost+"w="+yarkost1,1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 500); } o.send(); }Не читает значение
И не должен. Метод getElementsByClassName, возвращает массив элементов с таким классом, а не отдельный элемент. Для проверки уберите в 5-ой строке .value, а после строки 5 поставьте alert(yarkost.length) - должен показать количество таких элементов в массие. Если у Вас элемент с таким классом 1, то и пожет 1. В этом случае Вы можете вместо
document.getElementsByClassName("article").value;
писать
document.getElementsByClassName("article")[0].value;
Т.е. брать нулевой элемент массива, а не весь массив. Правда,мне здесь ещё .value не нравится. Лучше .innerText
А вообще, чем Вам не угодил метод getElemntById? Работает намного быстрее и никаких заморочек с массивами.
document.getElementsByClassName("article")[0].value;
Я так пробовал, не работало, вот и думал чтож такое то, а оказалось .innerText, и точно - работает, Спасибо.
А вообще, чем Вам не угодил метод getElemntById? Работает намного быстрее и никаких заморочек с массивами.
В стороннем скрипте регулятора (кручу стрелку мышкой мсеняется значение) вот такой код
$('#container').on('change', function (event) { $("#change").html(event.args.value);В том скрипте change было не ID, а имя события. Кроме того, какой там был элемент? Поди какой-нибудь INPUT? Ну, уж точно не DIV. с DIV такая штука сработает только в MSIE, а во всём остальном с геморроем.
Посмотрите, какой там в итоге элемент используется, тогда поговорим.
<!DOCTYPE html> <html lang="en"> <head> <title id='Description'>jqxKnob with 2 pointers. The minimum range in the sample is 10, the maximum is 90</title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdraw.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxknob.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#knob').jqxKnob({ value: [60, 80], min: 0, max: 100, startAngle: 150, endAngle: 510, snapToStep: true, rotation: 'clockwise', style: { fill: '#ebeced' }, marks: { colorRemaining: '#333', colorProgress: '#66707e', style: 'line', offset: '71%', thickness: 1, size: '6%', majorSize: '9%', majorInterval: 10, minorInterval: 2 }, labels: { offset: '88%', step: 10 }, changing: function(oldValues, newValues) { var range = newValues[1] - newValues[0]; if (range < 10) return false; if (range > 90) return false; }, progressBar: { style: [{ fill: '#66707e', stroke: '#66707e', strokeWidth: 0 }, { fill: '#66707e', stroke: '#66707e', strokeWidth: 0 }], size: '9%', offset: '58%', background: { fill: '#a2da39', stroke: '#a2da39', strokeWidth: 0 } }, spinner: { style: { fill: '#66707e', stroke: '#66707e' }, innerRadius: '0%', // specifies the inner Radius of the dial outerRadius: '58%', // specifies the outer Radius of the dial marks: { colorRemaining: '#a2da39', colorProgress: '#a2da39', type: 'circle', offset: '55%', thickness: 3, size: '1%', majorSize: '1%', majorInterval: 10, minorInterval: 10 } }, pointer: [{ type: 'circle', style: { fill: '#a2da39', stroke: '#a2da39' }, size: '5%', offset: '38%', thickness: 20 }, { type: 'circle', style: { fill: '#a2da39', stroke: '#a2da39' }, size: '5%', offset: '38%', thickness: 20 }] }); $('#knob').on('change', function (event) { $("#change").html("Values: " + event.args.value); }); }); </script> </head> <body> <div id='knob'></div> <br /><br /> <div id="change"></div> </body> </html>А, так это не голимый код страницы - это Вы опять какую-то стороннюю библиотеку используете :)))
Не, я этой библиотеки не знаю и разбираться - это полдня - день, ну правда, не могу. Сорри :(((
Поковыряйтесь сами, разберётесь.
Главное, сначала разберитесь на сервере, чтобы ещё аруиновсие проблемы туда не тянуть.
Так document.getElementsByClassName("article")[0].innerText; работает. Кручу колесо - меняется яркость)
Ну, и здорово! Поздравляю!
Найдите какую-нибудь книжку про dynamic html - научитесь ориентироваться во всех этих innerText'ах
Евгений здравствуй.
Изучаю innerText'ты
var on ='<img src="on.png">' var off ='<img src="off.png">' var q = document.getElementById("A0").innerHTML; var a = document.getElementById("A1").innerHTML; var z = document.getElementById("A2").innerHTML; document.getElementById("kn1").innerHTML = q; document.getElementById("kn2").innerHTML = a; document.getElementById("kn3").innerHTML = z;Подскажи пожалуйста, почему
document.getElementById("A01").innerHTML = on; работает
а
document.getElementById("A01").innerHTML = q; (где q считалось из файла и равно on) не работает
больше кода покажи, где читал куда вставлял.
document.getElementById("A01").innerHTML = on; работает
а
document.getElementById("A01").innerHTML = q; (где q считалось из файла и равно on) не работает
Чёт я в коде такого не вижу.
В любом случае, поставьте там alert (а лучше печать в отладочный div или textarea) чтоюы посмотреть чему оно равно перед присваиванием. навернка многое прояснтся.
<html> <head> <title>Cool dynamic page!!!</title> <script language="JavaScript"> var on ='<img id="on" onclick="myFunction()" src="on.png">' var off ='<img id="off" onclick="myFunction()" src="off.png">' var o=new XMLHttpRequest(); function dR() { o.open("GET","data.txt?r="+Math.random(),1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 1000); var q = document.getElementById("A0").innerHTML; var a = document.getElementById("A1").innerHTML; var z = document.getElementById("A2").innerHTML; document.getElementById('demo').innerHTML = q ; //if (q=='on') { //q=on; //} else { //q=off; //} document.getElementById('kn1').innerHTML = on ; document.getElementById('kn2').innerHTML = a ; document.getElementById('kn3').innerHTML = z ; } o.send(); } </script> </head> <body onload="dR()"> <p>Demo :<span id="demo"</span></p> <p>Кнопка 1:<span id="kn1"</span></p> <p>Кнопка 2:<span id="kn2"</span></p> <p>Кнопка 3:<span id="kn3"</span></p> <p>A0:<span id="A0"</span></p> <p>A1:<span id="A1"</span></p> <p>A2:<span id="A2"</span></p> </body> </html>data.txt
больше кода покажи, где читал куда вставлял.
Основной код, - это код Евгения в самом начале темы.
А где закрывающий скобки? у Вас написано в строка 39-43
а должно быть
Видите разницу?
по поводу же что и как Вы ставите. Давайте Вы приведёте два кода, что я ьог их явно сравнить. И кроме того, не пренебрегайте отладочной печатью На Web странице печать делается легко, а она Вам поможет понимать что происходит. Нужен пример организации печати?
вот тебе и основной код, скобку забыл в span
<html> <head> <title>Cool dynamic page!!!</title> <script language="JavaScript"> var on ='<img id="on" onclick="myFunction()" src="on.png">' var off ='<img id="off" onclick="myFunction()" src="off.png">' var o=new XMLHttpRequest(); function dR() { o.open("GET","data.txt?r="+Math.random(),1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 1000); var q = document.getElementById("A0").innerHTML; var a = document.getElementById("A1").innerHTML; var z = document.getElementById("A2").innerHTML; document.getElementById('kn1').innerHTML = q ; document.getElementById('kn2').innerHTML = a ; document.getElementById('kn3').innerHTML = z ; } o.send(); } </script> </head> <body onload="dR()"> <p>Кнопка 1:<span id="kn1"></span></p> <p>Кнопка 2:<span id="kn2"></span></p> <p>Кнопка 3:<span id="kn3"></span></p> <p>A0:<span id="A0"></span></p> <p>A1:<span id="A1"></span></p> <p>A2:<span id="A2"></span></p> </body> </html><html> <head> <title>Cool dynamic page!!!</title> <script language="JavaScript"> var on ='<img id="on" onclick="myFunction()" src="on.png">' var off ='<img id="off" onclick="myFunction()" src="off.png">' var i; var q; var zna = ["A0", "A1", "A2"]; var knopu = ["kn1", "kn2", "kn3"]; var o=new XMLHttpRequest(); function dR() { o.open("GET","data.txt?r="+Math.random(),1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 1000); for (i = 0; i < zna.length; i++) { q = document.getElementById(zna[i]).innerHTML; if (q=='on') { q=on; } else { q=off; } document.getElementById(knopu[i]).innerHTML = q ; } } o.send(); } </script> </head> <body onload="dR()"> <p>Кнопка 1:<span id="kn1"></span></p> <p>Кнопка 2:<span id="kn2"></span></p> <p>Кнопка 3:<span id="kn3"></span></p> <p>A0:<span id="A0"></span></p> <p>A1:<span id="A1"></span></p> <p>A2:<span id="A2"></span></p> </body> </html>Закрывающие скобки да, где т потерял, невнимательность и позднее время суток)
Нужен пример организации печати?
Да, хотелось бы.
<script>
alert (q);
document.getElementById("debug").innerHTML = q ;
</script>
<div id="debug"></div>
---
Книжек бы почитать, ты же не то что о чем то сложном спрашиваешь, это база, с таким подходом, может оно вам не надо ?
<script>
alert (q);
document.getElementById("debug").innerHTML = q ;
</script>
<div id="debug"></div>
---
Книжек бы почитать, ты же не то что о чем то сложном спрашиваешь, это база, с таким подходом, может оно вам не надо ?
Что Вы мне этим показали? В моём посту выше есть проверка полученных данных, алертом проверял аналогично.
<p>Demo :<span id="demo"</span></p>В переменных получается текст on/off соответственно.
Вопрос вовсе иного характера
document.getElementById('kn1').innerHTML = q ;почему если вместо q написать on/off выводится картинкаесли оставить q, которой присвоен текст on/off выводится сам текстНужен пример организации печати?
Да, хотелось бы.
это пример печати
<script>
alert (q);
document.getElementById("debug").innerHTML = q ;
</script>
<div id="debug"></div>
---
в 29 строке что находится в q? посмотри alert()
скобки не пропускай как тут
<p>Demo :<span id="demo"</span></p>---
и так на вскидку, не путаешь там on с "on"?
в 29 строке что находится в q? посмотри alert()
Я же говорю, в q находится on/off в зависимости от того, что находится в файле data.txt
в 29 строке что находится в q? посмотри alert()
скобки не пропускай как тут
<p>Demo :<span id="demo"</span></p>---
и так на вскидку, не путаешь там on с "on"?
[/quote]
Скобки скопировал из текста выше,извиняюсь.
как узнать "on" или on? разницу понимаю.
почему если вместо q написать on/off выводится картинка
смотри что прилетает в 22 строке в q
var q = document.getElementById("A0").innerHTML; var a = document.getElementById("A1").innerHTML; var z = document.getElementById("A2").innerHTML; alert(q); //выводт off document.getElementById('kn1').innerHTML = q ; document.getElementById('kn2').innerHTML = a ; document.getElementById('kn3').innerHTML = z ;var q = document.getElementById("A0").innerHTML; var a = document.getElementById("A1").innerHTML; var z = document.getElementById("A2").innerHTML; alert(q); //выводт off // ну, а если тут пишешь if( q == "off") q = '<img id="off" onclick="myFunction()" src="off.png">'; document.getElementById('kn1').innerHTML = q ; // тут картинка должна быть или с off приходит еще с какими то символами типа \r\n document.getElementById('kn2').innerHTML = a ; document.getElementById('kn3').innerHTML = z ;Я тоже думал про \r\n
Проверяю
<html> <head> <title>Agagagogo</title> <script language="JavaScript"> var on ='<img id="on" src="on.png">' var off ='<img id="off" src="off.png">' function dR() { setTimeout("dR()", 1000); var q = document.getElementById("A0").innerHTML; //alert(q); document.getElementById('kn1').innerHTML = q; //ставлю on/off работает, иначе выводи текст off } </script> </head> <body onload="dR()"> <p>Кнопка 1:<span id="kn1"></span></p> <p>A0:<span id="A0">off</span></p> </body> </html>в 11 приходит офф текст, то соответственно в 13 тоже будет текст офф, добавь строчку 7 из предыдущего сообщения моего меж 11 и 13 строку
в 11 приходит офф текст, то соответственно в 13 тоже будет текст офф, добавь строчку 7 из предыдущего сообщения моего меж 11 и 13 строку
Так это понятно, так я уже проверял, работает.
Я ж там вверху приводил код с if, всё работает.
какой пост, где там ?
<html> <head> <title>Cool dynamic page!!!</title> <script language="JavaScript"> var on ='<img id="on" onclick="myFunction()" src="on.png">' var off ='<img id="off" onclick="myFunction()" src="off.png">' var i; var q; var zna = ["A0", "A1", "A2"]; var knopu = ["kn1", "kn2", "kn3"]; var o=new XMLHttpRequest(); function dR() { o.open("GET","data.txt?r="+Math.random(),1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 1000); for (i = 0; i < zna.length; i++) { q = document.getElementById(zna[i]).innerHTML; if (q=='on') { q=on; } else { q=off; } document.getElementById(knopu[i]).innerHTML = q ; } } o.send(); } </script> </head> <body onload="dR()"> <p>Кнопка 1:<span id="kn1"></span></p> <p>Кнопка 2:<span id="kn2"></span></p> <p>Кнопка 3:<span id="kn3"></span></p> <p>A0:<span id="A0"></span></p> <p>A1:<span id="A1"></span></p> <p>A2:<span id="A2"></span></p> </body> </html>И для отладки алерт (для меня) неудомен, лучше так:
var q = document.getElementById("A0").innerHTML; var a = document.getElementById("A1").innerHTML; var z = document.getElementById("A2").innerHTML; console.log('Переменная q: '+q); console.log('Переменная a: '+a); console.log('Переменная z: '+z); console.log(''); document.getElementById('kn1').innerHTML = q ; document.getElementById('kn2').innerHTML = a ; document.getElementById('kn3').innerHTML = z ;сча, скопирую себе и потом проверю, впадло было, но лан...
у меня работает, я отбросил лишнее..АЯКС
<head> <title>Cool dynamic page!!!</title> </head> <body> <p>Кнопка 1:<span id="kn1"></span></p> <p>Кнопка 2:<span id="kn2"></span></p> <p>Кнопка 3:<span id="kn3"></span></p> <p>A0:<span id="A0"></span></p> <p>A1:<span id="A1"></span></p> <p>A2:<span id="A2"></span></p> <script> var on ='<img id="on" onclick="myFunction()" src="on.png" title="on">'; var off ='<img id="off" onclick="myFunction()" src="off.png" title="off">'; var i; var q; var zna = ["A0", "A1", "A2"]; var knopu = ["kn1", "kn2", "kn3"]; //типа получили данные document.getElementById("A0").innerHTML = "on"; document.getElementById("A1").innerHTML = "off"; document.getElementById("A2").innerHTML = "on"; for (i = 0; i < zna.length; i++) { q = document.getElementById(zna[i]).innerHTML; if (q=='on') { q = on; } else { q = off; } document.getElementById(knopu[i]).innerHTML = q ; } </script> </body> </html><script>
alert (q);
document.getElementById("debug").innerHTML = q ;
</script>
<div id="debug"></div>
С идеей согласен, по реализации три замечания.
1) лучше +=, т.к при = будет затирать старое и невозможно, например, в цикле печатать
2) лучше innerText, т.к. при innerHTML ,будет пытаться форматировать по правилам HTML
3) нужно добавить проверку типа, и если объект, то печатать список свойств циклом for in
Сегодня в течении дня выложу для ТС, если Вы не опередите
я показал базовый пример пример, в таком случае )) Вам стоит написать целый сриптик дебага ))) для автора
---
для интереса уже взял закинул и data.txt и index.html, у меня работает, автор или что-то в дата тхт не то пишет или х.з. у меня пашет.
у меня работает, автор или что-то в дата тхт не то пишет или х.з. у меня пашет.
да идея-то простая как резистор, чего ей не работать-то?
ЕвгенийП, респект, простой двиг, и можно запихнуть в 328.
Вообще, мне больше нра jQuery, ну просто ей удобно пользоваться (вписываешь id/класс по правилам CSS и вперёд), но тащемта я её использую только для трёх вещей:
1. асинхронный обмен инфой, т. о. AJAX
2. чисто клиентские красивости, т. е. доступ к CSS свойствам и фишки типа fadeOut()
3. JSON, хотя это уже прихоть
Мб удастся понять, что в ней отвечает за css(), attr() и выдрать. К сожалению я сейчас по ноздри в одном проекте (первый на берегу Хэйлунцзян escape room), но потом можно заняться.
Многоуважаемые друзья, что-то я запутался, никак не соображу..
#include <EtherCard.h> static byte mymac[] = { 0x74,0x69,0x69,0x2D,0x30,0x31 }; static byte myip[] = { 192,168,1,100 }; const char website[] PROGMEM = "192.168.1.100"; byte Ethernet::buffer[1000]; BufferFiller bfill; void setup () { Serial.begin(250000); ether.begin(sizeof Ethernet::buffer, mymac, 10); ether.staticSetup(myip); pinMode(3, OUTPUT); pinMode(6, OUTPUT); } void loop () { word pos = ether.packetLoop(ether.packetReceive()); if (pos){ // получаем заголовки char *data = (char *) Ethernet::buffer + pos; Serial.print(data); // проверяем на наличие в заголовках нужных нам строк if (strstr(data, "GET /index.htm") || strstr(data, "GET / HTTP/1.1") ) { bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/html\r\n" "\r\n" "<html>" "<head>" "<meta charset=\"utf-8\">" "<title>Яркость</title>" "<script src=\"/evgeniip.js\"></script>" "</head>" "<body onload=\"dR()\">" "<input type=\"range\" min=\"0\" max=\"255\" step=\"5\" id=\"qp\" value=\"0\"><br>" "<input type=\"range\" min=\"0\" max=\"255\" step=\"5\" id=\"wp\" value=\"0\"><br>" "<br>" "Яркость первого светодиоода:<span id=\"q\"></span><br>" "Яркость второго светодиода:<span id=\"w\"></span>" "<br>" "</body>" "</html>" )); } if (strstr(data, "GET /kaka.htm") ) { int yarkost = atoi(strstr(data, "q=") + 2); int yarkost1 = atoi(strstr(data, "w=") + 2); analogWrite(3, yarkost); analogWrite(6, yarkost1); bfill = ether.tcpOffset(); bfill.emit_p(PSTR( "HTTP/1.0 200 OK\r\n" "Content-Type: text/plain\r\n" "\r\n" "q = $D\r\n" "w = $D\r\n" ),yarkost,yarkost1); } ether.httpServerReply(bfill.position()); } }evgeniip.js
var o=new XMLHttpRequest(); function dR() { var yarkost = document.getElementById("qp").value; var yarkost1 = document.getElementById("wp").value; o.open("GET","kaka.htm?r="+Math.random()+"q="+yarkost+"w="+yarkost1,1); o.onload=function(){ var a=this.responseText.replace(/\s*[\r\n=]+\s*/g, "=").replace(/^\s+/,"").replace(/\s+$/,"").match( /([^=]+)/g); for (var i=0, len=a.length; i< len; i+=2) try { document.getElementById(a[i]).innerText=a[i+1]; } catch(e) {}; setTimeout("dR()", 1000); } o.send(); }Имею два ползунка, от 0 до 255. Двигаю, всё прекрасно работает. По умолчанию при загрузке страницы яркость обоих равна 0.
Я никак не пойму, хочу селать, скажем три кнопки
value="0"//значение 1 кнопки
value="100"// второй
value="255"// третьей
Как мне осуществить передачу value если Id один