ReferenceError:找不到变量:$,jquerymobile + phonegap

时间:2013-08-15 17:34:24

标签: android jquery jquery-mobile cordova

我是新手。我想保存用户在首选项管理器中输入的值,并让它自动填充一个字段(如果已由用户填写)。我的Android logcat中出现了“ReferenceError:找不到变量:$ at file:///android_asset/www/index.html:53”。我的应用程序也崩溃了。我做错了什么?

<html>
<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <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" />-->
    <link rel="stylesheet" type="text/css" href="css/jquery.mobile.structure-1.3.2.css" />
    <link rel="stylesheet" type="text/css" href="css/jquery.mobile.theme-1.3.2.css" />
    <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.3.2.css" />
    <title>Hello World</title>

    <script type="text/javascript">
        document.addEventListener("deviceready", onDeviceReady, false);

        //once the device ready event fires up, you can safely do your thing
        function onDeviceReady(){
            //document.getElementById("welcomeMsg").innerHTML += "Phonegap is ready! version=";
        }

        $(function(){
            $('#savebutton').click(function(){
                //this is where the user manually keys in values, do error checking here
                window.localStorage.setItem("user_lat", $('#user_lat').val());
            });

            //called when the page is being shown
            $('#newpage').live('pageshow', function(){
                var userLat = window.localStorage.getItem("user_lat");
                if (userLat.length > 0){
                    $('#user_lat').val(userLat);
                }      

            });
        });


    </script>
</head>
<body>
    <div id="home" data-role="page">
        <div data-role="header">
            <h1>Home Page</h1>
        </div>
        <div data-role="content">
            Hola Phonegap & Jquery mobile!
            <a href="#newpage" data-role="button">Go to new page</a>
        </div>
        <div data-role="footer" data-position="fixed">
            <h4>Footer</h4>
        </div>
    </div>
    <!--2nd page-->
    <div id="newpage" data-role="page">
        <div data-role="header">
            <h1>Manually specify your GPS coordinates</h1>
        </div>
        <div data-role="content">
            <label for= "user_lat">Latitude:</label>
            <input type="text" name="user_lat" id="user_lat" value=""/>
            <a id ="savebutton" href="" data-role="button">Save</a>
        </div>
        <div data-role="footer" data-position="fixed">
            <h4>Footer</h4>
        </div>
    </div>

    <script type="text/javascript" src="phonegap.js"></script>
    <script type="text/javascript" src="js/jquery-1.10.1.js"></script>
    <script type="text/javascript" src="js/jquery.mobile-1.3.2.js"></script>        
</body>

2 个答案:

答案 0 :(得分:1)

你需要在你的页面中包含jQuery才能使用你没有的$(jQuery)。您可以添加脚本标记并在src属性中提供jquery的url。在head标记中添加此标记,以便在需要之前添加它。

<script src="http://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>

答案 1 :(得分:1)

如果未定义'$',我认为jQuery没有正确加载..

尝试:

if ( $.mobile ) {
   // loaded
} else {
  // not loaded
} 

检查是否加载了jQuery mobile,或者尝试使用普通jQuery:

if (!jQuery) {
     alert("jQuery is not loaded");
}