JQuery Checked Calculator

来源：互联网发布：时间管理书籍知乎编辑：程序博客网时间：2024/06/06 21:04

test.html

<html><head><script type="text/javascript" src="jquery.js"></script><script type="text/javascript" >    $(document).ready(function () {        $('label').click(function () {            var total = 0;            $('.option:checked').each(function () {                total += parseInt($(this).val());                $(this).parent().css('background', 'green')            });            $('.option:not(:checked)').each(function () {                $(this).parent().css('background', '#fff')            });            $('#total').html('$' + total);        });    });    </script></head><body><label><input type="checkbox" class="option" value="200" /> Project1</label><br /><label><input type="checkbox" class="option" value="300" /> Project2</label><br /><label><input type="checkbox" class="option" value="400" /> Project3</label><br /><label><input type="checkbox" class="option" value="800" /> Project4</label><br /><label><input type="checkbox" class="option" value="1200" /> Project5</label><br /><div id="total" >$0</div></body></html>