特效描述:利用jquery实现 复选框选中按钮,利用jquery实现复选框选中按钮
代码结构
1. 引入CSS
<link rel="stylesheet" type="text/css" href="css/demo.css" />
2. 引入JS
<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/customInput.jquery.js"></script>
3. HTML代码
<!-- /demoHeader --> <form> <fieldset> <legend>Which genres do you like?</legend> <input type="checkbox" name="genre" id="check-1" value="action" /> <label for="check-1">Action / Adventure</label> <input type="checkbox" name="genre" id="check-2" value="comedy" /> <label for="check-2">Comedy</label> <input type="checkbox" name="genre" id="check-3" value="epic" /> <label for="check-3">Epic / Historical</label> <input type="checkbox" name="genre" id="check-4" value="science" /> <label for="check-4">Science Fiction</label> <input type="checkbox" name="genre" id="check-5" value="romance" /> <label for="check-5">Romance</label> <input type="checkbox" name="genre" id="check-6" value="western" /> <label for="check-6">Western</label> </fieldset> <fieldset> <legend>Caddyshack is the greatest movie of all time, right?</legend> <input type="radio" name="opinions" id="radio-1" value="1" /> <label for="radio-1">Totally</label> <input type="radio" name="opinions" id="radio-2" value="1" /> <label for="radio-2">You must be kidding</label> <input type="radio" name="opinions" id="radio-3" value="1" /> <label for="radio-3">What's Caddyshack?</label> </fieldset> </form> <div style="text-align:center;clear:both"> </div>