Javascript Flask应用程序在'；它在外部文件中_Javascript_Jquery_Python_Flask

Javascript Flask应用程序在'；它在外部文件中

javascript jquery python flask

Javascript Flask应用程序在'；它在外部文件中,javascript,jquery,python,flask,Javascript,Jquery,Python,Flask,我有包含CSS和JS的HTML文件。在创建我的flask应用程序时，我决定将CSS和JS分开，以便在静态目录中分离文件当我将所有内容都放在一个HTML文件中时，所有内容都会按预期工作，但是当CSS和JS位于单独的文件中时，JS的某些部分不会执行这是我在HTML文件中导入的： <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></scr

我有包含CSS和JS的HTML文件。在创建我的flask应用程序时，我决定将CSS和JS分开，以便在静态目录中分离文件

当我将所有内容都放在一个HTML文件中时，所有内容都会按预期工作，但是当CSS和JS位于单独的文件中时，JS的某些部分不会执行

这是我在HTML文件中导入的：

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='scripts/main.js') }}"></script>
    <link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.4.2/pure-min.css">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
</head>

此功能不起作用：

$('#user_button').click(function(event) {
    $("#user_id").html($('option:selected').html());
    $('.button_div').show();
});

但更奇怪的是，当所有的东西都在一个HTML文件中时，它们就可以工作了

有什么想法吗？

您需要将

移到

标记之外（例如，移到

的末尾），或者需要放入

$（“#用户按钮”）。单击（…）内部$（文档）.ready（…）
发生的情况是，浏览器在处理
标记时开始加载外部脚本文件。加载文件后，浏览器立即执行该文件，并将单击事件绑定到#user_按钮
。这发生在它处理
标记之前，因此#user_按钮
还不是DOM的一部分
如果您试图检查$（“#用户按钮”）
，您会看到它是空的
console.log($('#user_button'));

这个输出
[]

我也遇到过类似的问题。检查网络时，从缓存加载静态js。
当我关闭缓存时，它开始工作。
因此，您需要在开发过程中重新启动调试服务器或关闭缓存。
您确定它正在加载外部文件吗？@IanAuld yes，因为.hide（）函数在文档加载时工作。。hide（）
是似乎正在加载的jQuery的一部分。但是您的独立脚本正在加载吗？通过查看源代码并单击链接进行检查。页面上是否存在任何JavaScript错误？@i默认此jQuery部分无效$（'#user_按钮'）。单击（函数（事件）{$（“#user_id”）.html（$（'option:selected'）.html（）；$（'.button_div'）.show（））太好了，谢谢！另外，我相信我在纽约一个python活动上见过你。
console.log($('#user_button'));

[]