In questo semplicissimo ma molto pratico esempio voglio illustrarvi come ottenere il valore di un attributo “data” (html5) prelevato selezionando un radio buttton tramite jQuery.
Per prima cosa includiamo l’ormai famosissimo jQuery nella nostra pagina in questo modo
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
Successivamente creiamo il nostro form. Per praticità nel mio form saranno presenti soltanto 2 radio button
<form name="form"> <input type="radio" name="prova" id="prova" data-prova="valore Prova 1" />Prova 1 <br /> <input type="radio" name="prova" id="prova" data-prova="valore Prova 2" />Prova 2 </form>
A questo punto invece ecco il nostro script jquery che ci consentirà di prelevare il valore dell’attributo data-prova (ovviamente data-prova) è solo un nome a caso ideato per questo esempio. Nel vostro form reale potete aggiungere quanti “data” volete.
<script> $(document).ready(function() { $("input:radio[name=prova]").click(function(){ var valore = $(this).data("prova"); alert(valore); }); }); // chiude ready.function </script>
Per far si che si possa visualizzare il valore ho scelto di mostrarlo tramite un banale comando di alert.
Per la DEMO di questo esempio potete consulare la pagina “Come prelevare il valore di un attributo data con jQuery”
Ogni vostro commento per me è preziosissimo, quindi, se vi va, lasciatelo pure!