Flask路由跳转后页面内嵌JS脚本无法触发问题

看起来你遇到的是浏览器缓存或页面加载机制导致的脚本执行异常问题，我来帮你一步步排查和解决：

首先先修正几个明显的代码小问题，避免它们干扰排查：

• 你的routes.py里函数缩进有问题！Python是缩进敏感语言，路由装饰器下面的函数定义必须和装饰器对齐，否则会抛出语法错误，导致路由无法正常注册。正确写法应该是：

@routes_bp.route('/')
def home():
    return render_template('home.html')

@routes_bp.route('/register')
def register():
    return render_template('register.html')

• 你的base.html里引用的JS文件是client.js，但目录里实际是custom.js，文件名不匹配会导致JS加载失败（虽然这不是alert不触发的直接原因，但会引发控制台报错），建议修正为：

<script src="{{ url_for('static', filename='js/custom.js') }}" defer></script>

接下来是核心问题：为什么从home页面跳转时alert不触发，刷新就正常？
最可能的原因是浏览器的BF Cache（后退/前进缓存）或普通页面缓存：当你从home点击链接跳转到register时，浏览器可能复用了之前缓存的页面实例，而缓存页面里的内嵌脚本已经执行过一次，不会重复触发；但手动刷新时，浏览器会强制重新加载页面，脚本就会再次执行。

这里给你两种解决方法，选一种适合你的即可：

方法1：禁止浏览器缓存register页面 #

在routes.py的register路由里添加缓存控制头，强制浏览器每次都重新请求页面：

from flask import make_response, render_template

@routes_bp.route('/register')
def register():
    resp = make_response(render_template('register.html'))
    # 设置禁止缓存的响应头
    resp.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate'
    resp.headers['Pragma'] = 'no-cache'
    resp.headers['Expires'] = '0'
    return resp

方法2：把脚本逻辑移到外部JS文件（更推荐） #

内嵌脚本容易受缓存或页面加载顺序影响，把alert逻辑移到static/js/custom.js里，利用defer的特性确保DOM加载完成后执行：

1. 修改register.html，给页面加个标识（比如给body加类名）：

{% extends "base.html" %}

{% block body %}
<div class="register-page">
<!-- 你的register页面内容 -->
</div>
{% endblock %}

2. 在custom.js里添加逻辑：

// 因为用了defer，这里可以直接判断页面标识
if (document.querySelector('.register-page')) {
    alert('hello');
}

这种方法更稳定，也符合前端代码分离的最佳实践，不管是跳转还是刷新，只要页面加载完成就会触发alert。

最后，修正完上述问题后再测试一下，应该就能解决你的alert不触发问题了。

备注：内容来源于stack exchange，提问作者AnalyzingTasks