Raspberry Pi - 使用JQuery的Flask服務器不工作脫機（聯機工作）

我是一個初學者，我有什麼應該是一個簡單的問題來解決。但是，在研究了許多論壇並嘗試了技術解決方案之後，我無法讓代碼脫機工作，但它確實可以很好地在線加載JQuery。讓我現在開始解釋我的工作。Raspberry Pi - 使用JQuery的Flask服務器不工作脫機（聯機工作）

我用Flask創建了一個應用程序，所以我可以使用智能手機應用程序或導航器（樹莓本地主機）來操縱檢測機器人。我寫了2個代碼，Python服務器和HTML客戶端。它的工作原理就好了網上，讓jQuery庫，因爲它遵循：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

現在我想使它脫機工作，我試圖在這個網站的其他問題給出多種解決方案，但到目前爲止，我無法做到這一點。我試着下載JQuery並放入相同的文件夾，並在代碼中引用它，但沒有成功。這是我認爲會是的。

<script src="jquery-1.9.1.min.js" type="text/javascript"></script>

我就確定把同樣的名稱和文件夾，子文件夾嘗試，有和沒有「/」，但沒有什麼工作。

目前我使用的也是在線css（對於圖片），但是我在嘗試脫機JQuery的時候也試着刪除它。我只想讓JQuery脫機工作，這樣我就可以完成這個頁面。

再次，我是一個新手，所以我很抱歉，並提前感謝您的幫助。

這裏是完整的HTML文件，它可以在網上很好地工作，它有一些葡萄牙語，但他們並不重要，因爲問題只是在本地加載Jquery。再次感謝您的關注。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<!doctype html> 
 
<html> 
 
<head> 
 
<meta name="viewport" content="initial-scale=1, maximum-scale=1"> 
 
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"> 
 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
 
</head> 
 

 
<style> 
 
h3 {text-align: left;} 
 
span {font-weight: bold;} 
 
</style> 
 

 
<script type=text/javascript> 
 
    $(
 
    // Ao pressionamento de um botão, realizar um pedido ajax para o servidor realizando a determinada função 
 
    function() 
 
    { 
 
     $('#frente').click(function() 
 
     { 
 
     $.getJSON('/_frente'); 
 
     }); 
 
\t $('#re').click(function() 
 
     { 
 
     $.getJSON('/_re'); 
 
     }); 
 
\t $('#esquerda').click(function() 
 
     { 
 
     $.getJSON('/_esquerda'); 
 
     }); 
 
\t $('#direita').click(function() 
 
     { 
 
     $.getJSON('/_direita'); 
 
     }); 
 
\t $('#verticalcima').click(function() 
 
     { 
 
     $.getJSON('/_verticalcima'); 
 
     }); 
 
\t $('#verticalbaixo').click(function() 
 
     { 
 
     $.getJSON('/_verticalbaixo'); 
 
     }); 
 
\t $('#posinit').click(function() 
 
     { 
 
     $.getJSON('/_posinit'); 
 
     }); 
 
\t $('#azimuteesquerda').click(function() 
 
     { 
 
     $.getJSON('/_azimuteesquerda'); 
 
     }); 
 
\t $('#azimutedireita').click(function() 
 
     { 
 
     $.getJSON('/_azimutedireita'); 
 
     }); 
 
     $('#d').click(function() 
 
     { 
 
     $.getJSON('/_distancia', function(data) 
 
      { 
 
       $("#distaprox").text(data.distaprox); 
 
      }); 
 
     }); 
 
     
 
    } 
 
    ); 
 

 
</script> 
 
<!-- Uma simples pagina JQuery Mobile para realizar o controle remoto do sistema robotico de inspeção --> 
 

 
<body> 
 
    <div data-role="header"> 
 
    <div><h3>ELMO CRSEA IFF</h3></div> 
 
    </div> 
 
    <div style="width:400px;;"> 
 
    <form> 
 
    <div id="float1" style="width:200px;float:left;"> 
 
    <p>&nbsp;Direcional:</p> 
 
    <p>&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
 
    <button type="button" name="frente" id="frente" style="font-size:40px"><i class="fa fa-arrow-up"></i></button> 
 
    </p> 
 
    <p>&nbsp;<button type="button" name="esquerda" id="esquerda" style="font-size:40px"><i class="fa fa-arrow-left"></i></button> 
 
    &nbsp&nbsp&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
 
    <button type="button" name="direita" id="direita" style="font-size:40px"><i class="fa fa-arrow-right"></i></button> 
 
    </p> \t 
 
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
 
    <button type="button" name="re" id="re" style="font-size:40px"><i class="fa fa-arrow-down"></i></button> 
 
    </p> 
 
    </div> 
 
    <div id="float2" style="200px;float:left;"> 
 
    <p>&nbsp;Câmera:</p> 
 
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
 
    <button type="button" name="verticalcima" id="verticalcima" style="font-size:40px"><i class="fa fa-toggle-up"></i></button> 
 
    </p> 
 
    <button type="button" name="azimuteesquerda" id="azimuteesquerda" style="font-size:40px"><i class="fa fa-toggle-left"></i></button> 
 
    &nbsp;&nbsp;<button type="button" id="posinit" name="posinit" style="height:50px;width:50px;font-size:15px">Inicial<i</i></button> 
 
    &nbsp;<button type="button" name="azimutedireita" id="azimutedireita" style="font-size:40px"><i class="fa fa-toggle-right"></i></button> 
 
    </p> 
 
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp&nbsp; 
 
    <button type="button" name="verticalbaixo" id="verticalbaixo" style="font-size:40px"><i class="fa fa-toggle-down"></i></button></p> 
 
    </div> 
 
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
 
    <button type="button" id="d" name="d" style="height:50px;width:50px;font-size:15px">Medir<i</i></button> 
 
    Distância aproximada = <span id="distaprox"></span>cm</p> 
 
    </form> 
 
    </div> 
 

 
    <footer> 
 
    <p><h3>Copyright 2016 IBL</h3></p> 
 
    </footer> 
 
</body> 
 
</html>

來源

2016-12-12 Iverton Lima

嘗試創建一個靜態的文件夾，將承載所有的JS和其他靜態文件，象下面這樣：

static/ 
    - js/ 
    - css/ 
    - ...

現在，把你的jquery文件js/文件夾和使用以下內容在您的模板中：

url_for('static', filename='js/jquery-1.9.1.min.js')

在您的模板中，您將有：

<script src="{{ url_for('static', filename='js/jquery-1.9.1.min.js') }}" type="text/javascript"></script>

來源

2016-12-12 14:59:09 ettanany

非常感謝！我花了數小時試圖找到解決方案。欣賞你幫助我的時間。 –

Raspberry Pi - 使用JQuery的Flask服務器不工作脫機（聯機工作）

回答

相關問題