javascript - How to style specific divs based on checkboxs -



javascript - How to style specific divs based on checkboxs -

okay want alter style of specific divs based on checkboxes beingness clicked..

i have several checkboxs this...

<input type="checkbox" class="the-checkbox" onchange="test()" value="1"> <input type="checkbox" class="the-checkbox" onchange="test()" value="2"> <input type="checkbox" class="the-checkbox" onchange="test()" value="3">

each of these correspond div...

<div class="panel-heading" id="panel-1"> <div class="panel-heading" id="panel-2"> <div class="panel-heading" id="panel-3">

value="1" id="panel-1, id="panel-2"with id="panel-2" etc

these elements dynamic , pulled database.

when checkbox clicked illustration 1 value="1" want alter colour of div "id panel-1".

i need work when multiple checkboxes checked styling "delete entry" functionality.

i having problem doing in javascript here have far...

function test(){ var checkboxes = document.getelementsbyclassname('the-checkbox'); (var i=0 ; < checkboxes.length; i++) { if (checkboxes[i].checked) { var cn = document.getelementsbyclassname('panel-heading')[i].id cn.style.backgroundcolor = "red"; // know line wrong } } }

you on right track

the value of checkbox link between checkbox , div. value 1 corresponds div panel-1 etc. utilize value corresponding div:

correspondingdiv = div id ("panel-" + value of selected checkbox) if (checkboxes[i].checked) { //get value of checkbox var val = checkboxes[i].value; //since value link between checkbox , div, //use corresponding div var correspondingdiv = document.getelementbyid("panel-" + val); //and apply background color correspondingdiv.style.backgroundcolor = "red"; }

javascript html css checkbox

Comments

Post a Comment

Popular posts from this blog

model view controller - MVC Rails Planning -

model view controller - MVC Rails Planning - i'm starting rails , i'm building app stores films info, user can watch film , give grade on web application. i have coded cinema model, controller , views. now, have 2 questions: should need create model , controller grading? in case, should create or should wait , create first users model , controller? yes, on model , controller grades. that'd feasible way maintain track of who's graded what. it's create first, i'd start users, since grades depend on both films , users. ruby-on-rails model-view-controller
Read more

ruby on rails - Devise Logout Error in RoR -

ruby on rails - Devise Logout Error in RoR - while using devise in ror, encountering unusual error when trying log out url different root url. displays me : actioncontroller::invalidauthenticitytoken in devise::sessionscontroller#destroy" for illustration if rooting path after log in '/structure', , seek log out '/general' error, while logging out '/structure' fine. any help highly appreciated. ruby-on-rails ruby devise
Read more

html - Submenu setup with jquery and effect 'fold' -

html - Submenu setup with jquery and effect 'fold' - i want open submenu jquery effect fold, problem if user "hover effect" fast menu remain open, how can avoid this, jquery code is: $('ul.mainmenu li').hover( function() { $(this).children('ul').show('fold', 570); }, function() { $(this).children('ul').hide('fold', 500); } ); my jsfiddle link is: http://jsfiddle.net/9wkbf/ updated fiddle the reason behind problem is, first event $(this).children('ul').show('fold', 570); queued , until completes, sec animation not start. the next snippet can workaround $('ul.mainmenu > li').hover( function() { $(this).children('ul').show('fold', 570); }, function() { $('ul:not(.mainmenu)').hide('fold', 500); } ); *important note : work current scenario. jquery html css
Read more