0

在菜单栏部分的python代码部分（如app.py）中，我们可以将导航栏定义为：

#      Define navbar with logo                        #
#######################################################
logo = img(src='/static/img/logo192.png', height="55",
           width="70", style="margin-top:-15px",
           )

# here we define our menu items
nav = Nav()

# registers the "top" menubar
nav.register_element('top', Navbar(logo,
                                   View('Home', 'index'),
                                   View('LogIn', 'login'),
                                   View('SignUp', 'signup'),
                                   ))

我的模板中的代码部分 html：

<body>
    <div class="navbar navbar-fixed-top">
        {% block navbar %}                
                {{nav.top.render()}}
        {% endblock %}
    </div>

徽标 img 不可点击 我怎样才能使此图像可点击到任何链接

4

1 回答 1

0

如果我们在我的模板文件中添加一个脚本是可能的

向 <img 添加 id 属性后：

#      Define navbar with logo                        #
#######################################################
logo = img(id='logo', src='/static/img/logo192.png', height="55",
           width="70", style="margin-top:-15px",
           )

并且可以将 <img 标签更改为带有 js 脚本的 <a 标签：

</body>

{% block scripts %}
  {{super()}}
<script>
 var initi = document.getElementById('logo').outerHTML;
 console.log(initi);
 var code =
    '<a id = "alogo" href="">' +
    initi +
    '</a>';
console.log(initi);
window.addEventListener('load', function(event) {
    document.getElementById('logo').outerHTML = code;
    document.getElementById('alogo').href ="{{ url_for('image_map') }}"
  });

</script>
{% endblock %}
于 2021-11-06T23:00:00.493 回答