【问题标题】:Uncaught ReferenceError: $ is not defined how to solve?Uncaught ReferenceError: $ is not defined怎么解决?
【发布时间】:2015-11-24 19:21:11
【问题描述】:

我在cordova build中点击按钮重定向到另一个页面时遇到问题,错误是Uncaught ReferenceError: $ is not defined

// For an introduction to the Blank template, see the following documentation:
// http://go.microsoft.com/fwlink/?LinkID=397704
// To debug code on page load in Ripple or on Android devices/emulators: launch your app, set breakpoints, 
// and then run "window.location.reload()" in the JavaScript Console.
(function () {
    "use strict";

    document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );

    function onDeviceReady() {
        // Handle the Cordova pause and resume events
        document.addEventListener( 'pause', onPause.bind( this ), false );
        document.addEventListener('resume', onResume.bind(this), false);
        $("getas").click(function () {
            alert("The paragraph was clicked.");
        });
      
        
        // TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
    };

    function onPause() {
        // TODO: This application has been suspended. Save application state here.
    };

    function onResume() {
        // TODO: This application has been reactivated. Restore application state here.
    };
} )();
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />

    <!--
        Customize the content security policy in the meta tag below as needed. Add 'unsafe-inline' to default-src to enable inline JavaScript.
        For details, see http://go.microsoft.com/fwlink/?LinkID=617521
    -->
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
    <title>CatechesisMobileApp</title>

    <!-- MobileApp references -->
    <link href="css/index.css" rel="stylesheet" />
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    <script src="cordova.js"></script>
    <script src="scripts/platformOverrides.js"></script>

    <script src="scripts/index.js"></script>

</head>
<body>
    <p>Mobile App - Inicio</p>

    <button id="getas">Ver Alunos (GET ALL)</button>
    <br />
    <br />
    <button id="geta">Ver Aluno (GET ID)</button>
    <br />
    <br />
    <button id="posta">Inserir Aluno (POST)</button>
    
    <!-- Cordova reference, this is added to your app when it's built. -->
   
</body>
</html>

我做错了什么?我已经在 onclick 按钮“document.location.href='example.html'”中尝试过,但根本不起作用

谢谢

【问题讨论】:

  • 请不要在您的 Cordova 应用程序中远程加载 JQuery JS 和 CSS 等资源 - 将它们移动到本地以说明您的脚本文件夹。如果您依赖远程样板 JS 作为框架,该应用程序将运行缓慢且无法在离线情况下运行。你是怎么到另一页的?你是远程加载吗?理想情况下,您的应用应该是单个页面,其所有页面模板都在本地构建到应用中,并且应该使用 API 从服务器获取数据,而不是依赖远程 HTML 文档。
  • 我现在把这个引用放在本地,但没有解决问题,同样的错误引用到 $("getas").click(function () {** **$ 处未捕获的错误 现在它加载资源失败,错误 加载资源失败:服务器响应状态为 404(未找到)
  • 这意味着您仍然没有将其指向正确的路径。仔细检查你的路径。尝试文件的相对路径和绝对路径。
  • 这有帮助吗? (function () { ... } )(jQuery); 我想我以前见过这个在哪里使用这个(function () {} )(); 让一切都保持在本地?
  • 此时我有这个但也没有工作:(

标签: javascript jquery


【解决方案1】:

Philip Clegg 的评论非常接近。您需要将 jQuery 传递到闭包中。这是SO question explaining it

(function ($) {
"use strict";

document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );

function onDeviceReady() {
    // Handle the Cordova pause and resume events
    document.addEventListener( 'pause', onPause.bind( this ), false );
    document.addEventListener('resume', onResume.bind(this), false);
    $("#getas").click(function () {
        alert("The paragraph was clicked.");
    });


    // TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
};

function onPause() {
    // TODO: This application has been suspended. Save application state here.
};

function onResume() {
    // TODO: This application has been reactivated. Restore application state here.
};
} )(jQuery);

【讨论】:

  • 谢谢...我知道我很接近 :)
【解决方案2】:

getas 是一个 id,所以你应该选择它

$("#getas")

【讨论】:

  • 虽然这是正确的,但它不能回答问题。
  • 为什么要投票?是的,它指出了一个错误,但它并不能解决问题所在。这个答案应该扩展到涵盖所有内容,或者应该是评论。它当然不值得两次赞成。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-12-24
  • 1970-01-01
  • 1970-01-01
  • 2017-07-06
  • 2021-12-08
  • 2015-07-04
相关资源
最近更新 更多