Question

这是一个带有javascript的简单html页面。我无法让我的网页输入任何一个if语句。我可以让它在JSFiddle上工作，但不能在我的崇高文本编辑器的页面上工作。

<!DOCTYPE html>
<html>
  <head>
    <title></title>
  </head>
  <body>
    resize this panel
    <p id="xy">

    </p>
    <script>
      $(document).ready(function() {
        // Execute on load
        checkWidth();
        // Bind event listener
        $(window).resize(checkWidth);
      });

      function checkWidth() {
        var windowWidth = $(window).width();
        var windowHeight = $(window).height();
        $("#xy").text("width: "+windowWidth + "   height: " + windowHeight);
        if (windowWidth >= 700 && windowWidth <= 800 && windowHeight >= 400 && windowHeight <= 500) {
          alert("dimention matched");
        }
        else {
          alert("Nope")
        }
      }
    </script>
  </body>
</html>

Answer 1

您错过了jQuery库。将以下脚本放在</head>

之前

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>

当前代码在到达此行时停止，因为美元符号是对jQuery的调用，而您没有：$（＆＃34;＃xy＆＃34;）。text（＆＃34; width：＆＃34; + windowWidth +＆＃34; height：＆＃34; + windowHeight）;

Answer 2

首先，我建议你加入jquery.min.js，你可以在jquery.com上下载。

接下来，在将它用作快捷命令NameOfFunction（）之前，应该初始化要更改JavaScript的顺序。

Answer 3

当您添加jquery时，就像已经提到的同事一样，您仍然会遇到一个小问题：每次尝试调整窗口大小时，即使它只是1px，您也会遇到警报（甚至是多个警报）。因此，即使对于测试，下面也不那么烦人了：

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <title></title>
</head>
<body>
  resize this panel
  <p id="xy">
  </p>

  <p id="another">
  </p>

  <script>
 function checkWidth() {
   var windowWidth = $(window).width();
   var windowHeight = $(window).height();
   $("#xy").text("width: "+windowWidth + "   height: " + windowHeight);
   if (windowWidth >= 700 && windowWidth <= 800 && windowHeight >= 400 && windowHeight <= 500) {
     $("#another").text("Match!");
   }
   $(window).resize(checkWidth);
 }  

$(document).ready(function() {
   // Execute on load
   checkWidth();
   // Bind event listener
   $(window).resize(checkWidth);
});
    </script>
</body></html>

如果/ else语句不会输入javascript

3 个答案: