2016-01-22 99 views
-1

我的工作我的第一個PhoneGap的應用程序,我使用jQuery移動與它面臨的問題,我已經下載了jQuery Mobile和

我試圖用特定的顏色將頁面分成4格,然後在點擊任何一個時打印提醒。 這是我裏面的index.html代碼:

<!DOCTYPE html> 
<!-- 
    Copyright (c) 2012-2014 Adobe Systems Incorporated. All rights reserved. 

    Licensed to the Apache Software Foundation (ASF) under one 
    or more contributor license agreements. See the NOTICE file 
    distributed with this work for additional information 
    regarding copyright ownership. The ASF licenses this file 
    to you under the Apache License, Version 2.0 (the 
    "License"); you may not use this file except in compliance 
    with the License. You may obtain a copy of the License at 

    http://www.apache.org/licenses/LICENSE-2.0 

    Unless required by applicable law or agreed to in writing, 
    software distributed under the License is distributed on an 
    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY 
    KIND, either express or implied. See the License for the 
    specific language governing permissions and limitations 
    under the License. 
--> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <meta name="format-detection" content="telephone=no" /> 
     <meta name="msapplication-tap-highlight" content="no" /> 
     <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 --> 
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> 
     <link rel="stylesheet" type="text/css" href="css/index.css" /> 


     <title>Hello World</title> 
     <style> 
      .camArea 
      { 
       width: 50%; 
       float:left; 
       background: red; 
        height: 100%; 
      } 
      .camSection 
      { 
       width:100%; 
       height: 50%; 

      } 
      .camContainer 
      { 
       width: 100%; 
       height: 100%; 
       position:fixed; 
      } 
     </style> 


    </head> 
    <body> 
     <div class="app"> 
      <div class="camContainer"> 
      <div class="camSection"> 
       <div class="camArea" style = "background:blue" ></div> 
       <div class="camArea" style = "background:#ff4512"></div> 
      </div> 

      <div class="camSection"> 
       <div class="camArea" style = "background:green"></div> 
       <div class="camArea" style = "background:#34d3ff"></div> 
      </div> 
     </div> 
     </div> 
     <script type="text/javascript" src="cordova.js"></script> 
     <script type="text/javascript" src="js/index.js"></script> 
     <script type="text/javascript"> 
      app.initialize(); 

       $(".camArea").click(function(){ 
        alert("Toto") 
       }); 

     </script> 

    </body> 
</html> 

當我午飯應用程序或刷新頁面我得到這個錯誤:

Uncaught ReferenceError: $ is not defined 

,這就是我的應用程序看起來像一個錯誤

enter image description here

和whwn我點擊查看錯誤我看到這個

enter image description here

當我嘗試檢查寫在控制檯上如果$是存在的,我得到這個

function $(selector, [startNode]) { [Command Line API] } 

這是圖像 enter image description here

,當我嘗試包括此行

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

<head></head>

我得到這個錯誤:Uncaught TypeError: Cannot set property 'mobile' of undefined 這裏是圖像: enter image description here 任何一個可以幫助這個好嗎?

回答

0

錯誤:

$ is not defined 

爲不包括的jquery.js文件的一般信息。

它是不同的形式jquery移動refrences。

因此,只需將jquery.js插入到標題和jquery移動參考文件之前即可。

相關問題