URL更改后附加内容消失

Question

在我的网页上，我使用的是 Flask 微框架。为了让您更好地理解我的问题，我决定包含我的几个文件。希望我不会让你气馁。

示例 请记住，由于我的网站的复杂性，此示例不完整。但我希望它能说明问题。

我的script.py 运行服务器：

from flask    import Flask, request, render_template

app = Flask(__name__)

@app.route('/')
@app.route('/<name>')
def home(name=''):
    return render_template('home.html', name=name)

@app.route('/user/')
@app.route('/user/<task>')
def user(task=''):
    return render_template('user.html', task=task)

那我有template.html:

<!-- some html code -->
<div id="navBar"></div>

<div id="mainContent">
    {% block content %}
    {% endblock %}
</div>
<!-- some html code -->

和user.html:

{% extends 'template.html' %}
{% block content %}
    {% if task == 'homework' %}
        {% include '/tasks/homework.html' %}
    {% endif %}
{% endblock %}

最后是我的script.js：

// some jQuery script
$('#button').click(function(){
    $('#navTask').empty();
    $('#navTask').append('\
                    <div class="task">\
                        <a href="/user/homework">Homework</a>\
                    </div>');
});
// some jQuery script

回到我的问题！基本上它就是这样做的。单击#button 后，它会附加#navTask（位于页面某处的div）和一些div 以及指向/user/homework 的链接。一旦你点击Homework，Flask 就会识别出 URL 的变化并呈现 user.html，所以网页的某些部分会发生变化。我的问题是：一旦您单击链接Homework，链接Homework 也会消失。我不确定，如何解决它。

我想，通过将div.task 附加到#navBar，无论 URL 是什么，它都会在整个网页中发生变化。但据我所知，它没有。

我希望这种行为 - 页面上的某处有一个 div，单击#button 后，内容发生变化并出现新链接。当您单击链接时，页面上某处的内容会发生变化，但链接会保持在原来的位置。链接可能会消失，例如仅当您在 home 页面上时。

注意我现在很确定，如果我的期望是真实的。我可能只使用 jQuery 就可以做到这一点，但是因为main.py 要复杂得多，而且我使用的是从 URL 获得的数据，所以我仍然采用这种“方式”。

Answer 1

也许我误解了你，但如果你不想刷新所有页面内容，你需要使用点击链接触发的AJAX请求。

每当向服务器提交非 Ajax 请求时 - 页面将被完全重绘。

在服务器端，您可以检查它是否为XMLHTTPRequest，以及是否返回JSON数据或其他方便您的方法。

也许这个小flask-jquery-example 会帮助你。

附： JS端的当前位置可以通过window.location.pathname或$(location).attr('href')获取