Lucas-Li 2022-10-12 08:49 采纳率: 93.9%
浏览 69
已结题

javaScript点击事件解答

为什么if语句不管用呢？帮忙解答一下，谢谢！


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
    <link rel="stylesheet" href="04.css">
    <style type="text/css">
       #test{
         background:green;
         margin:10px auto;
       }
       #btn{
       margin:10px auto;
       display:block;
       }
   </style>
    <script type="text/javascript" rel="script">
     window.onload=function(){
        var a=document.getElementById("btn");
        var b=document.getElementById("test");
     a.onclick=function(){
      var jw=parseInt(b.style.width);
      var jh=parseInt(b.style.height);
      var nw=jw+10+"px";
      var nh=jh+10+"px";
          if(nw>="100px"){
             b.style.width="100px";
          }else{
             b.style.width=nw;
          };
             b.style.width=nw;
             b.style.height=nh;
       };
     };
     </script>
  </head>
<body>
    <button id="btn">Max</button>
    <div id="test" style="width:100px;height:100px"></div>
</body>
</html>
  • 写回答

5条回答 默认 最新

  • 任聪聪 全栈领域优质创作者 2022-10-12 09:00
    关注

    if语句要比较数字，不要比较字符串。

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
    <link rel="stylesheet" href="04.css">
    <style type="text/css">
       #test{
         background:green;
         margin:10px auto;
       }
       #btn{
       margin:10px auto;
       display:block;
       }
   </style>
    <script type="text/javascript" rel="script">
     window.onload=function(){
        var a=document.getElementById("btn");
        var b=document.getElementById("test");
     a.onclick=function(){
      var jw=parseInt(b.style.width);
      var jh=parseInt(b.style.height);
      var nw=jw+10;
      var nh=jh+10;
//这里不要用字符串，用数字，其次注意浮点数
          if(nw>=100){
             b.style.width="100px";
          }else{
             b.style.width=nw+"px";
          };
//这个地方要放在if前不然你的if语句没有效果
             b.style.width=nw+"px";
             b.style.height=nh+"px";
       };
     };
     </script>
  </head>
<body>
    <button id="btn">Max</button>
    <div id="test" style="width:100px;height:100px"></div>
</body>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(4条)

报告相同问题？

问题事件

  • 系统已结题 10月20日
  • 已采纳回答 10月12日
  • 创建了问题 10月12日

悬赏问题

  • ¥20 机器学习能否像多层线性模型一样处理嵌套数据
  • ¥20 西门子S7-Graph,S7-300，梯形图
  • ¥50 用易语言http 访问不了网页
  • ¥50 safari浏览器fetch提交数据后数据丢失问题
  • ¥15 matlab不知道怎么改，求解答！！
  • ¥15 永磁直线电机的电流环pi调不出来
  • ¥15 用stata实现聚类的代码
  • ¥15 请问paddlehub能支持移动端开发吗？在Android studio上该如何部署？
  • ¥20 docker里部署springboot项目，访问不到扬声器
  • ¥15 netty整合springboot之后自动重连失效