jQuery移動規則沒有被應用

這是我的index.jsp文件，但是jQuery手機CSS和JS並沒有完成他們的工作。jQuery移動規則沒有被應用

enter image description here

我的.css和.js文件在同一目錄級別的index.jsp。他們應該在不同的目錄中嗎？這裏是我的目錄結構

enter image description here

這裏是我的index.jsp：

<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="jquery.mobile-1.0a4.1.css" /> 
     <script type="text/javascript" src="jquery.mobile-1.0a4.1.js"></script> 
    </head> 
    <body> 
     <div data-role="fieldcontain"> 
      <label for="slider">Input slider:</label> 
      <input type="range" name="slider" id="slider" value="0" min="0" max="100" /> 
     </div> 
    </body> 
</html>

螢火蟲說，這兩個資源加載

enter image description here

來源

2011-05-13 blue-sky

什麼「N ot加載「是什麼意思？使用網絡流量監控器（例如Chrome開發者工具或Firebug內置的監控器）。請求的資源是？他們返回什麼狀態代碼？內容是否符合您的期望？你的服務器日誌說什麼？ – Quentin 2011-05-13 14:47:24

「未加載」我的意思是沒有引用js＆.css文件。 – 2011-05-13 14:51:08

HTML源代碼對我來說看起來很好。按照@大衛的評論。瀏覽器是否請求這些文件？你可以直接加載JS和CSS文件（通過在瀏覽器的URL欄中輸入URL）？ – 2011-05-13 14:59:55

你頁面是遠離參考頁面結構如圖所示here。

您應該具有以下包裹你的身體後，你的領域，包括：

<div data-role="page"> 
... your content in the body 
</div>

來源

2011-05-13 17:22:28

emmm你需要包括他們在文件的標題中：

<link rel="stylesheet" type="text/css" href="something.css" /> 
<script type='text/javascript' src='something.js'></script>

來源

2011-05-13 14:53:13 Neal

Plz查看問題編輯 – 2011-05-13 14:55:43

@ user470，只需用您的文件名替換'something' – Neal 2011-05-13 14:56:11

jQuery mobile要求jQuery也要加載。下載它，把它放在同一個文件夾中，然後在之前添加以下行，你加載jQuery mobile。

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

來源

2011-05-13 15:32:34 BalusC

謝謝，試過了，但現在沒有字段正在顯示在頁面上。我試過jQuery版本jquery-1.5.2.js和jquery-1.6.1.js，但結果相同 – 2011-05-13 15:50:09

閱讀jQuery手機文檔如何正確使用它。顯然你的'數據'屬性是不正確的或者什麼的。 – BalusC 2011-05-13 15:54:14

您需要添加一個數據角色=「頁面」，圍繞內容標籤以及添加了jQuery framwork

<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" /> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script> 
     <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script> 
    </head> 
    <body> 
     <div data-role="page"> 
      <div data-role="fieldcontain"> 
       <label for="slider">Input slider:</label> 
       <input type="range" name="slider" id="slider" value="0" min="0" max="100" /> 
      </div> 
     </div> 
    </body> 
</html>

來源

2011-05-13 18:12:26

而使用jQuery移動與JSP的需要，以確保您使用的是CDN路徑

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" /> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>

來源

2012-03-23 08:02:15 zDroid

jQuery移動規則沒有被應用

回答

相關問題