help slider
- Questo topic ha 16 risposte, 2 partecipanti ed è stato aggiornato l'ultima volta 11 anni, 6 mesi fa da crosby.
- AutorePost
- 19 Settembre 2012 alle 11:04 #2165crosbyPartecipante
Salve a tutti
Sono nuovo, ieri mi sono presentato.
Sono appassionato di elettronica e Arduino che ho collegato via ethernet al PC.
Mi piacerebbe fare una pagina HTML con degli slider per pilotare gli attuatori analogici collegati ad Aduino.
Questo è quello che ho fatto
===============================================
jQuery UI slider test – by luca aurienti
$(function() {
$(‘.cursore’).slider
({
slide: function(event, ui)
{
dev1_sn1.innerHTML = event.type;
}
});
//$(‘#slider_dev1_at2’).slider();
});
dev1_sn1
< span >< /span >
dev1_at2
< span >< /span >
=======================================================================
Ho definito una classe “cursore” per i due slider e l’evento slide viene richiamato per entrambi. Ma come faccio a sapere a quele slider si riferisce? In un caso devo scrivere dentro una span oppure un’altra span.
Un grazie anticipato
Luca19 Settembre 2012 alle 12:28 #2167jqueryitaliaAmministratoreCiao Crosby e benvenuto!
Anche per te inserisco una nota, che vale anche per tutti gli utenti del forum: EVITATE DI INSERIRE TAG HTML DI QUALSIASI TIPO all’interno del post, anche se all’interno del tag BBCode ‘code’.
Questo perchè in ogni caso i tag html vengono convertiti e non si riesce quindi a distinguere quanto avete inserito.La soluzione al tuo problema è abbastanza semplice e te la riporto in una pagina di test creata appositamente per te e che trovi qui https://www.jqueryitalia.org/tutorial/arduino.html.
Se hai difficoltà nel leggere il codice, fai un fischio che provvedo a spiegartelo 😉
19 Settembre 2012 alle 20:03 #2170crosbyPartecipanteCiao
Ti ringrazio infinitamente per la risposta e per la pagina di test.
Penso che adesso riusciro’ a portare avanti il mio progettino.
Mi metto al lavoro x studiare il sorgente (con i miei tempi da “non esperto” purtroppo).
Terro’ informati sugli sviluppi
un saluto
Luca Milano
P.S. per i tag HTML terro’ presente per le prossime comunicazioni20 Settembre 2012 alle 16:10 #2183crosbyPartecipanteUn saluto a tutti
Si funziona.
Dentro l’evento slide recupero le due informazioni che mi interessano: nome oggetto e valore (in particolare l’id oggetto con il codice preziosamente suggeritomi) per poi scrivere tutto dentro una span.
Allego il pezzettino di sorgente senza tag html$(‘.cursore’).slider
({
min : 0,
max : 1023,
slide: function(event, ui)
{
sliderValueID = $(this).attr(‘id’).replace(‘slider_’,”);
//$(‘#’+sliderValueID).innerHTML = ui.value; //cosi’ non funziona
var spanElem = document.getElementById(sliderValueID);
spanElem.innerHTML = ui.value;
}
});Non ho capito xke la notazione con il dollaro non funziona e devo usare getElementById, ma vabbe’ posso andare avanti a sviluppare il progettino
luca milano
20 Settembre 2012 alle 17:47 #2184jqueryitaliaAmministratoreNon è che non funziona crosby, è solo che nel codice di esempio che ti ho suggerito, il valore dell’id viene ‘strippato’ del valore ‘slider_’.
.replace(‘slider_’,”) vuol dire appunto ‘sostituisci il valore slider_ con nulla’ 😉
Sostituisci:
sliderValueID = $(this).attr(‘id’).replace(‘slider_’,”);con:
sliderValueID = $(this).attr(‘id’);e vedrai che funziona.
21 Settembre 2012 alle 16:36 #2188crosbyPartecipanteCiao
La cosa, grazie al tuo aiuto, funziona gia’ benissimo da adesso. Con questo aiuto sono riuscito a superare l’impasse in cui mi ero trovato.
Intendevo dire che dopo che recuperato (dentro slide) l’ID dell’oggetto e il valore devo scriverlo dentro un tag span, io faccio questo con:var spanElem = document.getElementById(sliderValueID);
spanElem.innerHTML = ui.value;se invece uso:
$(‘#’+sliderValueID).innerHTML = ui.value;
non funziona. Io avevo capito che questa notazione con il dollaro è equivalente.
Un saluto
Luca Milano21 Settembre 2012 alle 19:10 #2189jqueryitaliaAmministratoreOvvio che non funziona: innerHTML non è un attributo valido in jQuery!!! 🙂
Devi usare: $(‘#’+sliderValueID).html( ui.value );.
22 Settembre 2012 alle 11:36 #2190crosbyPartecipanteCiao
Ho provato. Tutto OK.
grazie ancoraLuca Milano
22 Settembre 2012 alle 21:34 #2191crosbyPartecipanteSalve a tutti
Purtroppo mi sono ficcato di nuovo nei guai.
Gli slider per pilotare gli attuatori dovrebbero essere contenuti in una table html che volevo generare dinamicamente.
E’ anche difficile spiegare la situazione e spero di riuscirci.
Provo a ridurre all’osso il codice javascript che genera la tablefunction carica()
{
sliderValueID = “dev1_sn1”;
griglia.insertRow(0);
griglia.rows[0].insertCell(0);
griglia.rows[0].insertCell(1);
griglia.rows[0].cells[0].innerHTML = “0“;
griglia.rows[0].cells[1].innerHTML = “”;
}questa funzione viene innescato con l’evento onload di body e genera una tabella con 1 riga e due colonne con questo contenuto
0
il codice non cambia
$(function() {
$(‘.cursore’).slider
({
min : 0,
max : 1023,
slide: function(event, ui)
{
sliderValueID = $(this).attr(‘id’).replace(‘slider_’,”);
$(‘#’+sliderValueID).html(ui.value);
}
});
});Ma in questo caso non appare neanche lo slider.
Puo’ dependere dal fatto che la porzione di html è stata generata dinamicamente?un saluto
Luca Milano
22 Settembre 2012 alle 22:42 #2192crosbyPartecipanteNon prendete in considerazione la mia precedente comunicazione. Ho inserito dentro dei tag HTML (e’ vero ero stato avvisato!). Il contenuto risulta incomprensibile.
luca
- AutorePost
- Devi essere connesso per rispondere a questo topic.