PhoneGap jquery移动错误:未捕获ReferenceError:$未定义

时间:2016-01-22 19:14:03

标签: javascript jquery cordova jquery-mobile phonegap-plugins

我正在开发我的第一个phoneGap应用程序,我遇到了使用jquery mobile的问题,我已经下载了jquery mobile和

我试图将页面划分为每个具有特定颜色的4个div,并在我点击其中任何一个时打印警报。 这是我在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 请帮忙吗?

1 个答案:

答案 0 :(得分:0)

错误:

$ is not defined

是不包含jquery.js文件的一般消息。

这是jquery mobile refrences的不同形式。

所以只需在标题和jquery mobile refrence文件之前插入jquery.js。