代码语言:javascript复制
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>商品统计</title>
<!--jquery版本差异会导致IE浏览器兼容问题,如果对兼容性要求高的话,最好使用原生JS写。-->
<script src="js/jquery-1.8.3.min.js"></script>
</head>
<body>
商品名称:<input type="text" id="spNanme" name="spName"></br>
商品单价:<input type="text" id="spPrice"></br>
购买数量:<input type="number" id="spNum"></br>
共计:<input type="text" id="total" readonly="readonly"></br>
<button type="button" id="btn">结账</button>
<script>
//对id选择器btn,使用click事件
$("#btn").click(function(){
//console.log($("#spPrice").val());
//console.log($("#spNum").val());
//var定义一个变量spPrice,变量的值是id选择器#spPrice的值
var spPrice=$("#spPrice").val();
//var定义一个变量spNum,变量的值是id选择器#spNum的值
var spNum=$("#spNum").val();
//var定义一个变量total,变量的值是spPrice*spNum乘积
var total=spPrice*spNum;
//console.log(total)
//找到id选择器的#total,将值定义成变量total的值
$("#total").val(total);
});
</script>
</body>
</html>
- var定义一个变量
- click点击事件