Jquery代码虽然已加载但未执行

Question

我有一个烧瓶应用程序，它呈现一个包含jquery代码的html模板：

<script type=text/javascript src="{{ url_for('static', filename='jquery- 
 3.3.1.min.js') }}">
 console.log("hi yah")
  $(document).ready(function() {
    $.ajax({url: "http://localhost/check", success: function(result){
      $("#div1").html(result);
    }});
  });
</script>

但是，无论我如何在html中包含jquery，代码都不会执行。但是，当我检查谷歌浏览器网络选项卡时，我可以看到，jquery已加载。

这个工作：

<script>
console.log("Hello World")
</script>

如果我运行此代码：

<script>
console.log("hi yah")
$(document).ready(function() {
  $.ajax({url: "http://localhost/check", success: function(result){
    $("#div1").html(result);
  }});
 });
</script>

我收到此错误：

未捕获的ReferenceError：$未在（索引）定义：37

Answer 1

尝试分离你的<script>标签。有一个<script>来获取jQuery代码，另一个用于你自己的JavaScript代码，如下所示：

<script type="text/javascript" src="{{ url_for('static', filename='jquery-3.3.1.min.js') }}"></script>
<script>  
  $(document).ready(function() {
    $.ajax({url: "http://localhost/check", success: function(result){
      $("#div1").html(result);
    }});
  });
</script>

如果这不起作用，那么获取jQuery文件的文件路径无效，在这种情况下你可以这样做：<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

另外，请确保在脚本类型周围加上引号：type="text/javascript"