javascript - 检查设备是否在 Flask 中移动

标签 javascript css iframe flask mobile

我正在使用 Flask 和 Materialise 显示 PDF 文件列表

<table class="highlight responsive-table">
    <thead>
        <th class="left-align"><i class="material-icons">call</i></th>
        <th class="left-align"><i class="material-icons">email</i></th>
        <th class="center-align"><i class="material-icons">picture_as_pdf</i></th>
    </thead>
    <tbody>
        {% for doc in docs %}
            <tr>
                <td>{{doc.phone if doc.phone}}</td>
                <td>{{doc.email if doc.email}}</td>
                <td>
                    <a href="#modal{{loop.index}}" class="modal-trigger"><i class="material-icons">open</i> Ouvrir</a>
                </td>
            </tr>
            <div class="modal" id="modal{{loop.index}}">
                <iframe src="/cv/{{doc.name}}" scrolling="no" width="100%" height="100%"></iframe>
            </div>
        {% endfor %}
    </tbody>
</table> 

enter image description here

PDF 使用 iframe 在模态窗口中显示。

enter image description here

当我在移动设备上打开页面时,它没有以模式显示 PDF,而是提示我下载 pdf,就像我试图直接下载它一样。当我在 Flask 中使用 for 循环时,我会收到每个 PDF 的下载提示。我想知道是否有一种方法可以检查用户代理是否是移动的,如果是这样的话,我将显示一个指向 pdf 的链接而不是模态窗口。

最佳答案

我使用 Flask-Mobility 解决了这个问题。它允许检测设备是否移动

from flask_mobility import Mobility

...

app = Flask(__name__)
Mobility(app)

...

{% for doc in docs %}
    <tr>
        <td>{{doc.phone if doc.phone}}</td>
        <td>{{doc.email if doc.email}}</td>
        <td>
            {% if request.MOBILE %}
                <a href="/cv/{{doc.name}}" target="_blank"><i class="material-icons">open</i> Ouvrir</a>
            {% else %}
                <div class="modal" id="modal{{loop.index}}">
                    <iframe src="/cv/{{doc.name}}" scrolling="no" width="100%" height="100%"></iframe>
                </div>
                <a href="#modal{{loop.index}}" class="modal-trigger"><i class="material-icons">open</i> Ouvrir</a>
            {% endif %}
       </td>
    </tr>
{% endfor %} 

关于javascript - 检查设备是否在 Flask 中移动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55375332/

相关文章:

javascript - 捕获传入的 URL 参数,然后使用 Javascript 传递给 iFrame Src

javascript - 未处理的拒绝 - Passport 登录应用程序 Node js

java - 如何将选择选项静态值获取到 Controller

javascript - 如何在 Durandal View 上触发退出/停用逻辑?

javascript - jQuery 水印 StackOverflow 是什么样的?

javascript - 如何在 wordpress 中嵌入网页 (indiegogo)

html - 如何使用 Sprite 设置背景位置?

javascript - 更改 div 以输入点击 polymer 而不使用 jquery

javascript - 单击按钮时设置列表元素的优先级颜色

javascript - 页面加载时的 jQuery Fancybox,iFrame 中的内容