css - JQuery Script to change href not working -
i want change css file radio options can't make script work. inserted code test won't work either. using bootstrap framework , works fine, css files work too.
my html file:
<!doctype html> <html> <head> <link id="estilos" rel="stylesheet" type="text/css" href="./bootstrapcolorschemes/hefestus.css" > <title>spider magic</title> </head> <body> <div class="container"> <form class="form-horizontal" id="myform"> <div class="radio-inline"> <label><input type="radio" name="optradio" value="./bootstrapcolorschemes/adventuetime1.css">at1</label> </div> <div class="radio-inline"> <label><input type="radio" name="optradio" value="./bootstrapcolorschemes/adventuretime2.css">at2</label> </div> <div class="radio-inline"> <label><input type="radio" name="optradio" value="./bootstrapcolorschemes/adventuretime3.css">at3</label> </div> </form> </div> <div>this border should red</div> <script src="./js/jquery-2.1.4.min.js"/> <script> $(document).ready(function(){ console.log('i ready'); $("div").css("border", "3px solid red"); $('#myform input').on('change',function(){ var selected=$('input[name="optradio"]:checked','#myform').val(); $('#estilos').attr('href',selected); alert(selected) }); });</script> <script src="./js/bootstrap.min.js"/> </body> </html>
the script tag can not self closed solidus needs close tag:
<script src="./js/bootstrap.min.js"></script> and change css should work:
$('.radio-inline').click(function() { $('#estilos').attr('href', $(this).val()); });
Comments
Post a Comment