Correction status:qualified
Teacher's comments:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> </head> <style> ul{list-style: none;width: 800px;margin: 0 auto;overflow: hidden;} ul li{width: 25%;text-align: center;line-height: 50px;float: left;} .img{width: 200px;height: 200px;border:1px solid #ccc;margin: 0 auto;margin-top: 100px;} .img img{width: 100%;} </style> <body> <ul class="ul"> <li>照片1</li> <li>照片2</li> <li>照片3</li> <li>照片4</li> </ul> <div class="img"> <img src="http://c.hiphotos.baidu.com/image/pic/item/8b13632762d0f703e39d0fd904fa513d2697c58c.jpg" alt=""> </div> <div class="jsq img"> <input class="input1" type="text"> <input class="input2" type="text"><br> <select name="" id="select"> <option value="请选择">请选择</option> <option value="1">+</option> <option value="2">-</option> <option value="3">*</option> <option value="4">/</option> </select> 结果:<p class="jg"></p> </div> </body> <script> var img=['http://d.hiphotos.baidu.com/image/pic/item/b3b7d0a20cf431ad184ee53e4736acaf2edd981d.jpg', 'http://f.hiphotos.baidu.com/image/pic/item/80cb39dbb6fd5266cdb2ba16a718972bd4073612.jpg', 'http://e.hiphotos.baidu.com/image/pic/item/4a36acaf2edda3ccd03c4d220de93901203f92dc.jpg', 'http://c.hiphotos.baidu.com/image/pic/item/8b13632762d0f703e39d0fd904fa513d2697c58c.jpg' ] $(".ul li").click(function(){ var a=$(this).index(); $(".img img").attr('src',img[a]); }) $("#select").change(function(){ var a=$('.input1').val(); var b=$('.input2').val(); // alert(typeof a);string类型 console.log(a,b); if(!/^[0-9]*$/.test(a)||!/^[0-9]*$/.test(b)){ alert("请输入数字"); return; } else{ var x=''; var a=parseFloat(a);//有点坑 var b=parseFloat(b); var num=$(this).val(); switch(num){ case '1':x=a+b; break; case '2':x=a-b; break; case '3':x=a*b; break; case '4':x=a/b; break; } $(".jg").html(x) } }) var str="852法国红酒1266"; console.log(parseFloat(str));//只能提取开头几位数字 console.log(parseInt(str)); </script> </html>
点击 "运行实例" 按钮查看在线实例