jquery - How to disable div after check checkbox -
hi i'm new web designing.please me one. have 2 html pages. in first 1 contains 2 checkboxes , second contains 2 divs 1 left side , 1 right side. want in first page 1 checkbox checked , 1 automatically goes disable.now second page 1 div automatically goes disable mode means functionality in not work on div.i mean if lhs checkbox checked in first page lhs div work in second page.
it possible or not?
i'm using html,bootstrap , jquery.
it better if you can share relevant code, here make illustration example purpose :
assumed our html code :
<!-- first page --> <input type="checkbox" class="mycheckbox" data-target="firstdiv" />first <br/> <input type="checkbox" class="mycheckbox" data-target="seconddiv" />second <hr/> <!-- second page --> <div id="firstdiv" class="mydiv">hello 1st div</div> <div id="seconddiv" class="mydiv">hello 2nd div</div>
and here js code :
$(document).on('click', '.mycheckbox', function () { var target = $(this).data('target'); if ($(this).is(':checked')) $('#' + target).addclass('disabled'); else $('#' + target).removeclass('disabled'); });
and 1 more, css code disable class :
.mydiv { padding:5px; border:1px solid black; background-color:blue; color:white; margin:2px; } .disabled { background-color:grey; color : #c0c0c0; opacity : 0.1; }
updated demo - disabled functionality on disabled div(event listener mostly)
i defined data-target
attribute on checkbox target specified div
matched id
.
Comments
Post a Comment