如何用jQuery实现简单（基础）的页面效果

在我们网购页面中会有以下的情况：

1.购物车在选购数量总价格会自动实现加减法运算！

买1个！！

买三个！！！

通俗的可以理解为一个简单的乘法计算器

HTML代码：

<div class="pro_num">
				数量：
				<select id="num_sort" style="width:40px;" >
					<option value="1">1</option>
					<option value="2">2</option>
					<option value="3">3</option>
					<option value="4">4</option>
					<option value="5">5</option>
				</select>
			</div>
			<div class="pro_price">
				总计：<span>200</span>元
			</div>

jQuery代码：

//数量价格改变

			var $span = $(".pro_price span");

			var div_price = $span.text();

			$("#num_sort").change(function () {

				var num = $(this).val();

				var amount = num * div_price;

				$span.text(amount);

			}).change();

2.五星好评！

HTML代码：

				给商品评分：
				<ul class="rating nostar">
					<li class="one"><a href="#" title="1分">1</a></li>
					<li class="two"><a href="#" title="2分">2</a></li>
					<li class="three"><a href="#" title="3分">3</a></li>
					<li class="four"><a href="#" title="4分">4</a></li>
					<li class="five"><a href="#" title="5分">5</a></li>
				</ul>
			</div>

jQuery代码：

			//产品评分效果

			//评分效果的图片点击

			$(".rating li a").click(function () {

				//当前事件超链接的title

				var title = $(this).attr("title");

				//跳出评分

				alert("你给出的评分是" + title);

				//parent():在给定的父元素下匹配所有的子元素

				//获取一个class下的所有子元素属性

				var cl = $(this).parent().attr("class");

				//获取图片的点击后的效果

				$(this).parent().parent().removeClass().addClass("rating  " + cl + "star");

			});

会以弹窗的方式显示评星！！