[jQuery笔记] 简单商品计算统计 - 成就云开发者社区

代码语言：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>
    &lt;script&gt;
        //对id选择器btn,使用click事件
        $(&#34;#btn&#34;).click(function(){
            //console.log($(&#34;#spPrice&#34;).val());
             //console.log($(&#34;#spNum&#34;).val());
            //var定义一个变量spPrice,变量的值是id选择器#spPrice的值
            var spPrice=$(&#34;#spPrice&#34;).val();
            //var定义一个变量spNum,变量的值是id选择器#spNum的值
            var spNum=$(&#34;#spNum&#34;).val();
            //var定义一个变量total,变量的值是spPrice*spNum乘积
            var total=spPrice*spNum;
            //console.log(total)
            //找到id选择器的#total,将值定义成变量total的值
            $(&#34;#total&#34;).val(total);
        });
    &lt;/script&gt;
        
&lt;/body&gt;

</html>
var定义一个变量
click点击事件