Good day to all)

Took example from the site , Demo 6

Everything works fine, though I can not understand how to put a handler on <select> , which would take value from there. That is, so that when the selector changes, the "content" changes.

Here is the code for the selector itself:

  <select id="cd-dropdown" class="cd-select"> <option value="-1" selected>Choose an animal</option> <option value="1" class="icon-monkey">Monkey</option> <option value="2" class="icon-bear">Bear</option> <option value="3" class="icon-squirrel">Squirrel</option> <option value="4" class="icon-elephant">Elephant</option> </select>

but the page itself is already displayed

  <div class="cd-dropdown"> <span>Choose an animal</span> <input type="hidden" name="cd-dropdown"> <ul> <li data-value="1"><span class="icon-monkey">Monkey</span></li> <li data-value="2"><span class="icon-bear">Bear</span></li> <li data-value="3"><span class="icon-squirrel">Squirrel</span></li> <li data-value="4"><span class="icon-elephant">Elephant</span></li> </ul> </div>

I understand that this "transformation" occurs in

jquery.dropdown.js

created 2 forms, forma1 with id = "f1", and similarly form2 with id = "f2", hide made one form on the select

onChange = "func (this.value)" but the function itself

  function func(par){ if(par==1){ document.getElementById('f'+par).style.display=''; document.getElementById('f'+2).style.display='none'; }else{ document.getElementById('f'+par).style.display=''; document.getElementById('f'+1).style.display='none'; } }

if it's a normal selector, then the function works.

when choosing different selects, the value changes

 <input type="hidden" name="cd-dropdown">

Tell me how to refer to this input, and when the value changes so that it runs func (). Thank you very much in advance))

    1 answer 1

    It seems that you need and means to follow only the hidden input.

     $('body').on('change', 'input[name=cd-dropdown]', function(){ // ваша функция тут })
    • aa .. yes) stupid)) connected, already there, but when you select another item in the selector, in the hidden value the value changes, but the forms do not change. Perhaps you should not apply this.value , and how else? - S1ash
    • I apologize for fooling) 1) jsfiddle.net/S1ash/m3R9A/10 if I choose the first time, then it’s normal, and the second is already showing the second form, and both of them do not disappear)) 2) It works on the selector, and But on the input - no. Again, the problem is how to take the value from the input. PS Here is [page] [1] [1]: depositfiles.com/files/kpjedaikr - S1ash
    • pfff ... now I need the help of a guru in understanding why the previous version did not work, but this is how jsfiddle.net/m3R9A/11 works - Yakovlev Andrei
    • Anyway, from inputa it does not take the value = (If you prescribe a (2) in the console, then it is normal to output everything in the browser. - S1ash