javascript - Form Field Input One After Another -

i creating form wizard guides user through each form element, showing tooltip describing each element. trying accomplish is:

• keep each form field disabled, excluding form field user filling out.
• when user wants continue onto next field, need click on tooltip field they're on. also, field needs non-empty advance.

i have tooltip appearing correctly, , vanishes upon click. can't figure out how in javascript code: "has user entered data current field , clicked on tooltip advance? okay, continue onto next field until we've reached submit button. otherwise, stay here on current field."

here code:

function prepareform() {   var inputs = document.getelementsbytagname("input");   (var = 0; < inputs.length; i++){       if (i !== 0){           inputs[i].disabled = "disabled";       }       // make sure tooltip tag present...       if (inputs[i].parentnode.getelementsbytagname("span")[0]) {           inputs[i].onfocus = function () {               this.parentnode.getelementsbytagname("span")[0].style.display = "inline";           }            // when user has entered information , clicked tooltip, continue onto next field.           inputs[i].parentnode.getelementsbytagname("span")[0].onclick = function () {               this.parentnode.getelementsbytagname("span")[0].style.display = "none";           }       }   } } window.onload = prepareform;   

i've tried entering other logic in onclick function, because gets executed @ time, don't have access inputs array. on how can accomplish appreciated. thanks!

as said comfortable jquery,i created this fiddle you.as dont know how showing tool-tip,let me know if mine not 1 using.this example can start , add own requirements.